首页 > 解决方案 > 如何通过连接在组件中使用状态

问题描述

我正在使用 reactjs 和 redux 来构建我的简单应用程序。我按照一些教程进行操作,但出现错误。

我的连接

const mapStateToProps = function(state) {
     console.log(state) // WHAT IS FORMAT? {....}
     return {
          messages: state.messages // i don't know state contain messsages key
     }
}

export default connect(mapStateToProps)(MyComponent);

和我的组件

const MyComponent= ({messages}) => (
        <ul>
            {messages.map(message => (
                <Child
                    key={message.id}
                    {...message}
                />
            ))}
        </ul>
)

我通过以下方式创建我的商店

createStore(
        reducer, applyMiddleware(myMiddleware())
    );

但我不知道state格式。它是一些关键的对象吗?我在 tut 中找不到任何定义state格式,并且出现错误

Uncaught TypeError: Cannot read property 'map' of undefined

如何理解和解决这个问题。

标签: reactjsredux

解决方案


提供给 connect 的 state 参数是一个包含当前 redux 状态的对象。您使用减速器创建的任何内容都将在此处提供。

有关更多信息,请参阅https://redux.js.org/api/store#getState

在您的情况下,您可能尚未设置任何减速器,因此尚未填充消息存储对象。如果您完成本教程,它将带您完成设置。


推荐阅读