本文介绍了与 mapStateToProps 一起使用时,“无法读取未定义的属性‘地图’"的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在尝试在我的 react/redux 功能组件中显示我的状态(用户):
const Dumb = ({ users }) =>{console.log('用户', 用户)返回 (<div><ul>{users.map(user => <li>user</li>)})}const 数据 = 状态 =>({用户:状态})连接(数据,空)(哑)
Dumb 用于容器组件中.users.map 语句有问题,但我认为数据是通过 connect 语句注入的?reducer 有一个初始状态,其中包含 1 个名称:
const users = (state = ['Jack'], action) =>{开关(动作.类型){案例'RECEIVED_DATA':返回 action.data默认:返回状态}}CodeSandbox
解决方案渲染时您没有使用连接的组件,因此组件中的 props 不可用
const ConnectedDumb = connect(数据,空值)(哑的);类容器扩展 React.Component {使成为() {返回 (<div><ConnectedDumb/>);}}
工作演示
I am trying to display my state (users) in my react/redux functional component:
const Dumb = ({ users }) => { console.log('users', users) return ( <div> <ul> {users.map(user => <li>user</li>)} </ul> </div> ) } const data = state => ({ users: state }) connect(data, null)(Dumb)Dumb is used in a container component. The users.map statement has an issue but I thought that the data was injected through the connect statement? the reducer has an initial state with 1 name in it:
const users = (state = ['Jack'], action) => { switch (action.type) { case 'RECEIVED_DATA': return action.data default: return state } }CodeSandbox
解决方案You aren't using the connected component while rendering and hence the props aren't available in the component
const ConnectedDumb = connect( data, null )(Dumb); class Container extends React.Component { render() { return ( <div> <ConnectedDumb /> </div> ); } }Working demo
更多推荐
与 mapStateToProps 一起使用时,“无法读取未定义的属性‘地图’"
发布评论