React Native子组件未收到更新的道具

Question

我正在尝试创建具有3个级别的分层菜单选择组件。

结构是这样的：

CategoryLv0
- > CategoryLv1
----> CategoryLv2

点击一个后CategoryLv0节点和初始渲染的CategoryLv1节点完成，一切都很好。 我遇到的问题是，当我单击CategoryLv1节点时，它应从组件链中的父组件发送更新的prop，以触发CategoryLv1级别的componentWillReceiveProps 。 这将setState并呈现CategoryLv2从该节点分支。 但是，出于某种原因，从未调用CategoryLv1的componentWillReceiveProps挂钩。 第一层（ CategoryLv0 ）按预期工作，并接收更新的道具，使我可以在componentWillReceiveProps设置setState来触发重新渲染。 似乎随后的级别应该像lv0一样起作用，但事实并非如此。

我提供了一个博览会小吃，所以您可以在实际中看到它。

编辑小吃已更新，以删除子组件中的冗余状态，componentWillReceiveProps和将extraData = {this.props}添加到ComponentSelectionComponent的flatLists Expo Snack中

 <div data-snack-id="SkcBrXsMG" data-snack-platform="android" data-snack-preview="true" data-snack-theme="dark" style="overflow:hidden;background:#212733;border:1px solid rgba(0,0,0,.16);border-radius:4px;height:505px;width:100%"></div> <script async src="https://snack.expo.io/embed.js"></script> 

Answer 1

特拉维斯（Travis）向我指出了正确的方向。 答案是我需要在子组件的FlatList使用extraData FlatList 。 没有它，它不知道要重新渲染。

因此，由于我将菜单的主状态作为道具传递给子组件，因此我设置了extraData={this.props}来访问该状态。 而且有效！