Question

我的onPress事件未切换对象的属性值“活动”，我不确定该为什么不起作用。我能想到的唯一其他解决方案是引用状态中的公共值？谁能解释为什么我不能以这种方式重新分配对象值？

const priorities = [
    {
        title: "item A",
        active: false
    },
    {
        title: "item B",
        active: false
    }

{priorities.map((item, p) => {
    return(
        <View key={p}>
        <Button title={item.title} type="outline" 
            color={state.backgroundColor}
            size= {45}
            style={{marginLeft:40, backgroundColor: item.active === false 
             ?"red" : "green"}}
            onPress={() =>{item.active = !item.active}}                
            />
        </View>)
})}

Answer 1

我对您的代码做了一些更正，希望这可以实现您想要的。

let checkActive = this.state.active;

{priorities.map((p) => {  return <View key={p}>
      <Button title={p.title} type="outline"
            size={45}
            style={{marginLeft:40, backgroundColor: checkActive ? 'red': 'green'}}/>
    </View>})}

将您的状态设置为默认值，以更改颜色，将活动状态设置为true或false。

Answer 2

尝试一下。

onPress={() =>{priorities[p].active = !priorities[p].active}}

但是实际上您应该使用状态来处理这些东西。

Answer 3

您应该在状态中存储按下事件的索引，并在循环内将其与迭代索引进行比较。这样，您就不需要突变对象。

onPress={()=>this.setState({activeIndex:this.state.activeIndex===p?-1:p})}

style={{backgroundColor:this.state.activeIndex===p?"green":"red"}}

希望这可以为您提供帮助！

通过映射的onPress事件切换对象属性

3 个答案: