給出了以下 React 組件：import React, { useEffect, useState } from "react";import { useDispatch, useSelector } from "react-redux";import { store, StoreState } from "../../redux/actions";import { setBackgroundAction } from "../../redux/title.actions";import "./Loader.scss";interface ReduxProps {  bgClass: string;}interface Props extends ReduxProps {  bgChange?: boolean;}export default function Loader(props: Props) {  const [bgClassOld, setBgClassOld] = useState<string>("");  const dispatch = useDispatch();  useEffect(() => {    const { bgChange, bgClass } = props;    if (bgChange) {      setBgClassOld(bgClass);      dispatch(setBackgroundAction("bg-white"));      dispatch(setBackgroundAction(bgClassOld));    }  });  return (    <div className="d-flex">      <div className="loader">        <img src="/loadscreen.gif" />      </div>    </div>  );}// function mapping(state: StoreState): ReduxProps {//   return {//     bgClass: state.title.backgroundClass,//   };// }這更像是一個(gè)理論上的問題，看看如何實(shí)際進(jìn)行以下更改：該組件Loader將從另一個(gè) npm 包（共享組件）導(dǎo)入。我的問題是我在當(dāng)前實(shí)現(xiàn)中包含了一個(gè) redux 狀態(tài)（將它從 Class 更改為 Functional 組件，所以mapping()它仍然在那里）。因?yàn)槲抑辉谖业摹爸鳌笨蛻舳酥袑?dǎo)入組件，所以我不會有整個(gè) redux 設(shè)置。所以我認(rèn)為我需要通過store和傳遞dispatch函數(shù)props。那么我應(yīng)該為我的組件創(chuàng)建一個(gè)道具store，當(dāng)我導(dǎo)入共享組件時(shí)我會在其中傳遞 redux 存儲嗎？我是否還為每個(gè)調(diào)度函數(shù)創(chuàng)建兩個(gè)道具？是否有意義或會有更好的方法？