reactjs - 渲染元素反应

Question

我有由地图渲染的数组。当我点击标签进行渲染时，我想要<ExamplesResultComponent>，但是这个渲染在地图的所有元素中，如何修复它？

return(
    data.map((element) =>

      <div className="table-element-block" >
        <div  className="table-element"><span className="table-element-content">{element.category}</span></div>
        <div  className="table-element"><span className="table-element-content">{element.input}</span></div>

        <div  className="table-element" onClick={() => this.play(element.audio)}>
        <label>
          <i className="material-icons microphone-i" >
            <PlayArrow ></PlayArrow></i>
        </label>
        </div>

        <div  className="table-element">
          <label onClick={() => getData(element.input,element.audio,true)} className="draw meet animation-border  mdl-button mdl-js-button mdl-button--icon mdl-button--file score-modified">
          <i className="material-icons microphone-i" />
          Score!
          </label>
        </div>
          this.renderEx();
        <hr className="hr"/>
      </div>
    )
)

标签： reactjs