Javascript 我有一个组件正在从存储区接收数据。如何更新接收到的数据并在发生更改时重新提交组件

我有一个存储，它为我提供了密码对象数组 例如：

const密码=[{
id:'HJGKJKJL'，
密码：“jhckjdhf”，
创建日期：2019年1月3日
},
{
id:'Uigkjhkj'，
密码：“kdjhfkjdhf”，
创建日期：2019年1月3日
}
]

出现此问题是因为您在您的状态中将两个按钮分配给了相同的值。通过切换一个按钮并更新该共享状态值，两个按钮都得到更新是有意义的

---

您应该做的是将按钮向下移动到子组件中，在子组件中它们跟踪自己的状态。因此，当您单击一个按钮时，它只会更改该组件的状态。

正如sellmeadog所说，您应该创建一个包含两个组件的父组件。每个组件都有自己的状态，父组件将为每个子组件提供道具。这样，每个按钮都有自己的状态，这意味着它自己的“禁用”。一般来说，它应该是这样的：

类密码容器扩展React.Component{
建造师（道具）{
超级（道具）；
常数数据=[
{
密码：“passwordone”，
创建日期：“2019年1月2日”，
},
{
密码：“passwordtwo”，
创建日期：“2019年1月2日”，
},
];
此.state={
残疾人士:错,，
数据：数据，
};
this.handleUpdate=this.handleUpdate.bind（this）；
}
handleUpdate（元素）{
//this.context.executeAction（removePassword，element.createdAt）
//this.context.executeAction（获取密码）
这是我的国家({
已禁用：！this.state.disabled，
});
}
render（）{
返回(
{this.state.data.map（元素=>{
返回；
})}
);
}
}
类密码扩展了React.Component{
建造师（道具）{
超级（道具）；
此.state={
残疾人士:错,，
数据：this.props.data，
};
this.handleUpdate=this.handleUpdate.bind（this）；
}
handleUpdate（元素）{
这是我的国家({
已禁用：！this.state.disabled，
});
}
render（）{
让元素=this.state.data；
返回(
{' '}
{element.createdAt}
this.handleUpdate（元素）}>
{this.state.disabled？'Confirm'：'Update'}
);
}
}
ReactDOM.render（，document.getElementById（'root'））

您永远不会跟踪您在
handleUpdate中单击的项目/id
。您可能会更好地将其封装到另一个组件中。谢谢您的帮助