我不明白为什么我不能.map
一个数组。
这是代码:
import React, { Component } from "react";
import { connect } from "react-redux";
import { fetchCourses } from "../../actions";
class Courses extends Component {
componentDidMount() {
this.props.fetchCourses();
}
render() {
console.log("this.props.payload.courses ", this.props.courses);
const courses = this.props.courses.map(course => {
return (
<tr>
<td>{course.coursename}</td>
<td>{course.coursetype ? "yes" : "no"}</td>
<td>{course.courseweeklyhours}</td>
<td>
<button>הסר</button>
</td>
</tr>
);
});
return (
<div>
Courses
{courses}
</div>
);
}
}
const mapStateToProps = state => {
// console.log('state ', state);
return {
courses: state.courses
};
};
export default connect(
mapStateToProps,
{ fetchCourses }
)(Courses);
这是console.log(渲染后的第一行)的结果
我有两个问题
答案 0 :(得分:2)
您需要更正减速器实现。您的控制台输出表明this.props.courses
是一个对象,它的一个键为courses
,它是一个数组,因此无法映射到this.props.courses
。
由于减速器似乎在courses
中以combinedReducer
命名,并且您的初始状态是数组,因此您还应该以数组而不是对象的形式返回更新后的状态
export default (state = [], action) {
switch(action.type){
case FETCH_COURSES: {
return action.payload.data
}
...
}
}