Arrays 我在数组中循环时遇到问题

我正在使用MyJSON为我的数据创建一个存储，我在循环它时遇到了麻烦

我尝试过.map、.forEach，但我一生都无法映射对象数组

TypeError: Cannot read property 'map' of undefined

JSON存储如下所示

const Leaderboard = (props) => {

    useEffect(() => {
        props.fetchScores();
    },[]);

    const renderList = () => {
        props.scores.map(item => {
            return <LeaderboardItem name={item.name} data={item.date} />
        })
    }

    return (
        <div className="leaderboard">
            <h1 className='leaderboard__header'> Leaderboard</h1>
            {renderList()}
        </div>
    );
};

const mapStateToProps = (state) => {
    return {
        scores: state.scores
    };
};

export default connect(mapStateToProps, { fetchScores })(Leaderboard);

难道我不能映射数组并返回每个对象吗

      10 | },[]);
      11 | 
      12 | const renderList = () => {
    > 13 |     props.scores.map(item => console.log(item))
         | ^  14 | }
      15 | 
      16 | return (

})

图像：

映射创建另一个数组作为原始数组的转换。你只是简单的控制台。登录每个项目，这将是forEach而不是map的用途

---

console.log的返回值未定义，在呈现[undefined，undefined，…]数组以呈现项目列表时可能会导致问题

这假设Actual.Pult Load是一个分数数组，如果不是

，可以考虑调整：

        props.scores && props.scores.map(item => {
            return <LeaderboardItem name={item.name} data={item.date} />
        })

---

如何连接组件？您没有正确传递数组。您也不会在renderListPlease中返回jsx，请添加更多代码。该错误表示props.scores不包含任何用于显示我的组件的更新帖子！当我在MapStateTops中输入console.logstate.scores时，它显示它包含对象数组。我还可以通过redux开发工具看到我的分数缩减器返回相同的分数数组，其中包含对象。请发布缩减器代码。州是不是有点像{scores:[]}？你需要像state.scores.scores那样连接它。state.scores是整个分数缩减器，如果列表是该对象上的键，则需要引用它。因为它说的是未定义的，所以请确保scores是combinereducer中的键。我最初返回这个，但得到的是TypeError:props.scores.map不是一个函数const renderList=>{props.scores.mapitem=>{return}我看到了你的更新，你是如何更新你的减速器中的数据的？state.scores是数组吗？或者它是一个包含分数数组的对象？我已经添加了两个redux开发工具的图片&以及我的reducer代码。它的确切状态是.scores.scores，因为当我console.log它时，它直接记录数组。我将它更新为scores.scores，但我仍然得到TypeError:无法读取未定义的属性“map”。罪魁祸首可能是它试图在从存储中检索状态之前映射数组吗？嗯，你应该在你的状态中定义一个默认值，这样你就不会处理不同的数据类型。我尝试了这个方法，但它没有崩溃，你能告诉我额外的props.scores&有什么作用吗？可能的情况是，当您运行props.fetchScores时，它实际上不会立即获取数据，因此，在获取集的值为it's之前，分数可能仍然未从其源定义，另一个可能的修复方法是为props.scores提供一个默认值数组[]

export default (state = {}, action) => {
switch(action.type) {
    case FETCH_SCORES:
        return { ...state, ...action.payload }
    default:
        return state;
};

const renderList = () => {
  props.scores.map(item => <div key={item.id}>{item.name}</div>)
}

const defaultState = {
  scores: []
}
export default (state = defaultState, action) => {
  switch(action.type) {
    case FETCH_SCORES:
        return { ...state, scores: ...action.payload }
    default:
        return state;
  };
}

        props.scores && props.scores.map(item => {
            return <LeaderboardItem name={item.name} data={item.date} />
        })