我正在尝试在React Native中切换ios
切换。但是当我更改时,开关又回到了初始位置。
我拥有的:
class ABC extends Component {
constructor(props) {
super(props)
this.state = {
obj: []
}
}
fetch(){
// fetch something from remote server, set it to state object array
}
setStatus(id, value){
var temp = [...this.state.obj]
temp.map((t) => {
if (t.id == id) {
t.flag = value
}
})
this.setState({ obj: temp })
}
render() {
return (
<View>
<FlatList
data={this.state.obj}
renderItem={({ item }) =>
<View>
<Text>{item.name}</Text>
<Switch
onValueChange={(val) => this.setStatus(item.id, val)}
value={item.flag}
/>
</View>
}
keyExtractor={({ id }, index) => id.toString()}
/>
</View>
);
}
}
我记录了obj
状态的前后值,它们似乎正在更新。应该再次渲染flatlist(例如网页刷新)吗?还是我缺少什么?搜索了SO
的答案,找不到我的错误。
Flatlist
具有称为 extraData
的道具。
此道具告诉Flatlist
是否重新渲染。
如果extraData
中的数据更改,则基于data
Prop中提供的新数据
因此,每当您需要重新渲染flater列表时,只需更改extraData
中的某些内容。
最佳方法是将状态传递给extraData
,该状态传递给Data
。
所以,只需通过extraData={this.state.obj}
。
还有其他称为forceUpdate
的方法。
您可以致电this.forceUpdate()
。
不建议这样做,因为这不仅会渲染flatlist列表,而且会渲染您调用此功能的整个组件。