我试图切换ios
Switch in react native。但是一旦我改变它,开关就会回到初始位置。
是)我有的:
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中提供的新数据进行平面列表重新渲染。
因此,无论何时需要重新渲染平面列表,只需更改extraData
中的内容即可。
最好的方法是传递状态toextraData
,传递给Data
。
所以,只需通过extraData={this.state.obj}
。
还有另一种叫做forceUpdate
的方式。
你可以打电话给this.forceUpdate()
。
但不建议这样做,因为这不仅会呈现Flatlist,还会呈现您调用它的整个组件。