react-Native 更改平面列表中所选项目的颜色 [英] react-Native Change color on selected item in flatlist
问题描述
我有一个呈现多个按钮的平面列表,我想在 esee 平面列表中标记选定的按钮,我尝试了很多东西,但在所有这些中,平面列表一旦我选择了一个,就会标记所有项目,除此之外,它不会更新,直到我更新组件中的某些内容并保存更改,然后它会进行热重新加载,这就是标记项目的显示方式
I have a flat list that renders several buttons, I want to mark the selected button inside esee flat list, I tried a lot of things but in all of them the flat list mark all the items once I select one, besides that, it does not update until i Update something in the component and save the changes, then it does hot reloading and this is how the marked items are displayed
constructor(props) {
super(props);
this.state = {
pressStatus: false,
};
_onShowUnderlay(){
this.setState({ pressStatus: true });
}
render() {
return (
<FlatList
keyExtractor={this._keyExtractor}
data={this.state.ninosPicker}
renderItem={({item}) => (
<View style={styles.hijos}>
<TouchableHighlight
activeOpacity={1}
underlayColor="#3fa9f5"
onShowUnderlay={this._onShowUnderlay.bind(this)}
style={this.state.pressStatus ? styles.buttonPress : styles.botonsito }
onPress={() => this.setHijo(item.grado, item.grupo)}>
<Text style={this.state.pressStatus ? styles.welcomePress : styles.titBtnGyG }>{item.name}</Text>
</TouchableHighlight>
<TouchableHighlight
activeOpacity={1}
underlayColor="#3fa9f5"
style={this.state.pressStatus ? styles.gradosPress : styles.grados }>
<Text style={this.state.pressStatus ? styles.welcomePress : styles.titBtnGyG }>{item.grado}</Text>
</TouchableHighlight>
<TouchableHighlight
activeOpacity={1}
underlayColor="#3fa9f5"
style={this.state.pressStatus ? styles.grupoPress : styles.grupo }>
<Text style={this.state.pressStatus ? styles.welcomePress : styles.titBtnGyG }>{item.grupo}</Text>
</TouchableHighlight>
</View>
)}/>
推荐答案
你必须考虑到在编码中你放置了一个独特的状态,在这种情况下,this.state.pressStatus,你需要的是在在每个对象中排列一个属性pressStatus,在执行按钮的动作时你必须改变那个按钮的状态
You have to take into account that in the coding you are placing a unique state, in this case this.state.pressStatus, what you need is to have in the arrangement in each object a property pressStatus, at the time of executing the action of the button you have to change the state of that button
这篇关于react-Native 更改平面列表中所选项目的颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!