时间戳

首页 > 解决方案 > 从 Redux 存储中检索状态

react-redux - 从 Redux 存储中检索状态

问题描述

我正在学习 Redux 全局状态存储并创建了一个简单的应用程序，当单击“选择”按钮时，所选项目将被添加到 SavedCourses 列表中。然后我想显示 SavedCourses 列表。但是现在我的代码没有显示列表。我的减速机有问题吗？我的沙盒链接在https://ky801.csb.app/#/

标签： react-redux

解决方案

实际上mapDispatchToProps，问题在于您的功能。 addCourse应该接受一个参数，即class_nbr. 但是你的this.props.addCourse函数会忽略它的参数，只是调用dispatch(addCourse()).

const mapDispatchToProps = (dispatch) => {
  return {
    addCourse: () => dispatch(addCourse())
  };
};

由于您实际上并没有通过课程信息，savedCourses因此您最终会像[undefined, undefined, undefined].

你可以改变你的mapDispatchToProps，以便它接受一个论点：

const mapDispatchToProps = (dispatch) => {
  return {
    addCourse: (class_nbr) => dispatch(addCourse(class_nbr))
  };
};

但是，当您所做的只是用相同的参数分派函数时，就没有必要将其定义mapDispatchToProps为函数。您可以只使用动作创建者的对象：

export default connect(mapStateToProps, {addCourse})(Courses);

如今，借助react-redux 钩子和redux-toolkit，Redux 变得更加容易。你可以使用这些来简化你的代码。

推荐阅读