如何将API数据传递给React组件？ （包括沙箱链接）

Question

如果我发布的内容不正确，我会道歉，但我确实已经花了9个小时，我准备好进入交通状况。

我在这里找到了真实的React + Redux应用程序：https://codesandbox.io/s/github/reactjs/redux/tree/master/examples/real-world

我的叉子在这里：https://codesandbox.io/s/wkq867jwll

真实世界的示例在路由更改时加载数据。而不是那样，当你点击“Go！”时，我的fork会加载数据。按钮。加载正常，数据正确标准化，并按预期显示在state.entities.artifacts中。

我最后一个问题是我无法获取List组件，它应显示state.entities.artifacts中要显示的项目。在我从API获取搜索结果后，它甚至没有尝试重新渲染。

让我知道我对React和Redux完全不熟悉，而且我真的在桌面上敲打着我。

：（

Answer 1

对于遇到同样问题的其他人，答案是通过state.entities.artifacts将我的项目（mapStateToProps）映射到道具，如下所示：

const mapStateToProps = (state, ownProps) => ({
  artifacts: state.entities.artifacts,
  ...
});

然后我可以在像这样的组件中使用它：

<List
  config={searchConfig}
  artifacts={artifacts}
  totalResults={totalResults}
/>

有关其工作原理的完整示例，您可以在以下位置查看我的沙盒：https://codesandbox.io/s/wkq867jwll

谢谢！