我正在尝试切换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
中搜索了答案,找不到我的错误。
答案 0 :(得分:3)
Flatlist
有一个叫做extraData
的道具。
该道具告诉Flatlist
是否重新渲染。
如果extraData
中的数据发生更改,则根据data
道具中提供的新数据重新提交平面列表。
因此,每当您需要重新呈现平面列表时,只需更改extraData
中的内容即可。
最好的方法是将状态传递到extraData
,然后传递给Data
。
因此,只需传递extraData={this.state.obj}
。
还有另一种称为forceUpdate
的方式。
您可以致电this.forceUpdate()
。
,但是不建议这样做,因为这不仅会呈现Flatlist,而且会呈现您要在其中调用的整个组件。