Javascript onClick每隔一次激活一次onClick事件

我遇到了一个问题，我创建了多个带有onClick事件的进度条，但是当我单击进度条时，其他进度条的onClick事件都被激活

我有一个for循环，它推送多个

，其中有一个要渲染的进度条

我想实现的是，当用户单击每个进度条时，模式上会显示不同的详细信息，具体取决于他们单击的进度条

我正在使用模态

谢谢你的帮助

代码：

getInitialState:function（）{
返回{showmodel:false}；
},
关闭（）{
this.setState（{showmodel:false}）；
},
开（）{
this.setState（{showmodel:true}）；
},
for循环(
bodyRows[cellIndex]。推送(
你好
{Math.floor（this.calculatePercent（value））+'%'}
)
)

问题在于，您通过单个状态变量控制所有进度，而不是使用单个状态变量，使用数组，使用以下方法：

getInitialState: function(){
   return { showModal: [] };
},

通过每个项目的索引：

onClick = {this.open(index)}

onHide = {this.close(index)}

show = {this.state.showModal[index] || false}

使用索引更新特定项：

open(index){
  let showModal = this.state.showModal.slice();
  showModal[index] = true;
  this.setState({ showModal});
},

close(index){
  let showModal = this.state.showModal.slice();
  showModal[index] = false;
  this.setState({ showModal});
},

---

我想您可以传递一个属性或其他东西来标识特定的单击。onClick={（）=>this.open（'progressBar1'）}很抱歉我在吃午饭，但我发现如果我不在循环中，然后在用户单击进度条时调用它，我可以根据单击的进度条将值传递到模式中并显示详细信息。不知怎的，我不能用@来提及您的名字。。马扬克Shukla@VincentGoh你可以这样做，那会更简单：）

open(index){
  let showModal = this.state.showModal.slice();
  showModal[index] = true;
  this.setState({ showModal});
},

close(index){
  let showModal = this.state.showModal.slice();
  showModal[index] = false;
  this.setState({ showModal});
},