gpt4 book ai didi

javascript - 如何在 Redux 中使用 render 解决这个问题?

转载 作者:行者123 更新时间:2023-12-01 00:05:15 25 4
gpt4 key购买 nike

我将我的项目从 React 转移到 React、Redux 和 React-Redux 堆栈,然后发生了错误。在转移到该堆栈之前,一切正常。 enter image description here 。我尝试在 3 天内修复它,但没有成功。

我的index.js:

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import store from "./store/date";
import {BrowserRouter} from "react-router-dom";
import {Provider} from "react-redux";
import App from "./App";
const rerender=()=> {
ReactDOM.render(
<BrowserRouter>
<Provider store={store}>
<App /></Provider></BrowserRouter>, document.getElementById("root")
);
};
rerender();
store.subscribe(()=>{
rerender()
})

我的日期文件(date.js):

import {combineReducers, createStore} from "redux";
import realtorsDate from "./realtorsDate";
let isMenuVisible = true;
const UpdateMenu = (state = isMenuVisible, action) => {
switch (action.type) {
case 'UpdateMenu' :
let copystate = !state;
return copystate;
default :
return state;
}
};
let menuDate=[
{
Name: "Main",
Symbol: "/",
Src: ""
},
{
Name: "logo",
Symbol: "img",
Src: "./../Images/logo.png"
},
{
Name: "About us",
Symbol: "#",
Src: "about"
},
{
Name: "Our team",
Symbol: "#",
Src: "team"
},
{
Name: "Vacancies",
Symbol: "/",
Src: "work"
},
{
Name: "Advantage",
Symbol: "#",
Src: "adv"
},
{
Name: "Contacts",
Symbol: "#",
Src: "cont"
}
]
let reducers=combineReducers({UpdateMenu,realtorsDate})
const store=createStore (UpdateMenu,menuDate);
export default store;

容器组件:

import {connect} from "react-redux";
import MobileMenu from "./menu";
let menuStateText= {
type: "UpdateMenu"
}
let MapStateToProps=(state)=>{
return {
menuDate: state.menuDate}}
let MapDispatchToProps=(dispatch)=>{
return {
UpdateMenu: ()=> {
dispatch (menuStateText)
}
}
}
let MobileMenuContainer=connect(MapDispatchToProps,MapStateToProps)(MobileMenu);
export default MobileMenuContainer

组件:

import React from "react"
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
import {faBars} from "@fortawesome/free-solid-svg-icons/faBars";
import "./../css/App.css"
import ParagraphOfMenu from "./paragraphMenu";
class MobileMenu extends React.Component {
render(props) {
debugger
let Menu =()=>{this.props.menuDate.map((el,i) => (
<ParagraphOfMenu el={el} key={i}/>
))}
return (
<div className="mobileMenuBlock">
<FontAwesomeIcon icon={faBars} onClick="return false"></FontAwesomeIcon>
<header className={(this.props.UpdateMenu) ?"hidemenu":"mobilemenu"}>
<nav>
<ul className="">
<Menu></Menu>
</ul>
</nav>
</header>
</div>
);
}
}
export default MobileMenu

代码链接:codesandbox

提前致谢

最佳答案

let MobileMenuContainer = connect(
MapStateToProps,
MapDispatchToProps
)(MobileMenu);

这是您的问题,您需要传递 MapStateToProps 而不是 MapDispatchToProps

关于javascript - 如何在 Redux 中使用 render 解决这个问题?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60431855/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com