如何映射存储中的对象（使用 redux-thunk）答案

【问题标题】：How to map objects in store (with redux-thunk)如何映射存储中的对象（使用 redux-thunk）
【发布时间】：2020-03-31 08:35:49
【问题描述】：

你好，我想通过 redux 迭代数组中的一个对象，redux-thunk

问题是，全局状态（存储）无法通过Array.map()进行迭代

这里是教程https://codesandbox.io/s/modest-pike-q0449的例子

这是我的版本https://codesandbox.io/s/redux-thunk-fetch-6wsr8

区别是……

在异步动作创建者

axios.get('https://jsonplaceholder.typicode.com/todos/1') //tutorial: return 1 object
axios.get('https://jsonplaceholder.typicode.com/todos')   //my experimental: return array of object

和UI组件

const dispatch = useDispatch();

// Tutorial------------------------------
{content.data && (
  <ul>
    <li>{content.data.id}</li>
    <li>{content.data.title}</li>
  </ul>
)}

// My Experimental------------------------ ERROR: content.map is not a function.
<ul>
  {content.map(todo => (
    <li key={todo.id}>{todo.title}</li>
  ))}
</ul>

我已经寻找解决方案。我找到了React.Children，但我不确定在这种情况下使用它。

谢谢

【问题讨论】：

标签： reactjs redux redux-thunk

【解决方案1】：

这就是你需要的

const content = useSelector(state => state.data || []);

可以通过在初始状态将数据初始化为[]来摆脱默认的空数组

function reducer(state = { data: [] }, action) {

}

// now access data
const content = useSelector(state => state.data);

【讨论】：