传递值时反应按钮类型发生变化

Question

所以我正在使用 flowtype 进行 React，我有一个类型为 ItemType 的值，它是一个具有不同属性的对象。

例如，如果我声明 item: ItemType，并且在控制台日志项中将打印出

Item { Property1: 'someValue', Property2: 'someValue', Property3: 'someValue'}

我正在尝试将变量作为值传递，例如

<button value={item} onClick={this.onButtonClick}>Click Me!</button>

据说我传入的 item 是一个 ItemType ，但是当我检查类型时它变成了一个字符串。我尝试控制台记录回调函数中的类型，如下所示

onButtonClick = event => {
  console.log("type checking: " + typeof event.target.value); // Output: type checking: string
}

我不知道为什么会这样，因为我需要变量是正确的类型而不是字符串。谁能解释一下这个问题？

Answer 1

按钮 value 属性在提交 HTML 表单时与其名称相关联，请阅读此处的道具： https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button

要实现我相信你想要的，你可以试试这个：

<button onClick={() => this.onButtonClick(item)}>Click Me!</button>

然后您应该可以访问 onButtonClick 方法中的项目对象。

onButtonClick = item => {
   console.log(item)
// output: { Property1: 'someValue', Property2: 'someValue', Property3: 'someValue'}
}

React button type changed while passing in a value