react-native - FlatList 仅在用户交互发生后更新

Question

我有一个组件从导航道具中获取数据，我用它来设置 CDM() 中的状态：

this.setState({
  data: this.props.navigation.getParam('data', 'Some Data')
})

然后在 FlatList 中使用该状态。当道具改变时...... FlatList 不会更新......直到客户端触摸屏幕。

我尝试将道具直接放入 FlatList：

data={this.props.navigation.getParam('data', 'Some Data')}

我试过使用 extraData 道具：

<FlatList
   style={{ flexGrow: 1, marginTop: 10 }}
   data={this.state.data}
   keyExtractor={(item, index) => index.toString()}
   extraData={this.props.navigation.getParam('data', 'Some Data')}
   renderItem={({ item }) => {...}>

我尝试使用 componentDidUpdate() 在道具更改但从未调用 CDU 时重置状态。

编辑： 我有一种感觉是因为当我添加项目时；我正在向后导航 (navigation.goBack()) 并且 goBack() 不会刷新状态？我不确定。

标签： react-nativereact-native-flatlistreact-props

Answer 1

找到了：

https://github.com/react-navigation/react-navigation/issues/922#issuecomment-344752635

它本质上是将一个函数作为参数传递并调用该函数以更改父级的状态，然后调用 goBack()