从onClick事件中选择JavaScript对象

我有一个包含两个数组的父组件

newChoiceArray: [
    { id: 1, text: '1', questionId: 'favourite number?', value: '1' },
    { id: 2, text: '2', questionId: 'favourite number?', value: '2' },
    { id: 3, text: '3', questionId: 'favourite number?', value: '3' },
  ],
  ChoiceArray: [
    { id: 4, text: 'red', questionId: 'favourite colour?', value: '1' },
    { id: 5, text: 'blue', questionId: 'favourite colour?', value: '4' },
  ],
}

我有一个组件，它为数组中的每个对象渲染一个按钮

const MultiChoiceQuestions = props => {
  const { multiChoiceArray, handleClick } = props
  return (
    <div>
      {multiChoiceArray.map(questionChoice => {
        return (
          <button type="button" key={questionChoice.id} onClick={handleClick}>
            {questionChoice.text}
          </button>
        )
      })}
    </div>
  )
}

而不是输出此

3

---

它应该输出这个

{id:3，text:'3'，questionId:'favorite number'，value:'3'}，

您可以将对象作为按钮值传递，例如：

{multiChoiceArray.map（questionChoice=>{
返回(
{questionChoice.text}
)
}

然后您可以使用currentTarget中的属性

value

捕捉到这一点：

testClick=event=>{
event.preventDefault（）
log（JSON.parse（event.currentTarget.value））
}

我不知道这是否是最好的方法，但我知道这是可行的

更新

我想知道这个问题，您是否会使用事件对象中的其他内容？否则您可以直接将该项传递到函数中：

{multiChoiceArray.map（questionChoice=>{
返回(
handleClick（问题选择）}>
{questionChoice.text}
)
}
//父文件
testClick=obj=>{
控制台日志（obj）
}

output是[object object]，有没有办法输出对象的道具？哦，好吧，我忘了，你像这样传递对象：value={JSON.stringfy（questionChoice）}，然后你可以使用：JSON.parse（event.currentTarget.value）我得到一个错误：TypeError:JSON.stringfy不是一个函数尝试我刚刚更新的第二个选项，我想这是解决这个问题的最好方法，或者你可以修复TypeError，我写错了…

JSON.stringify（questionChoice）

<MultiChoiceQuestions handleClick={this.testClick} multiChoiceArray={newChoiceArray} />
<MultiChoiceQuestions handleClick={this.testClick} multiChoiceArray={ChoiceArray} />

    testClick = event => {
      event.preventDefault()
      console.log(event.currentTarget)
  }