javascript - 动态按钮输出React.js

Question

我即将使用 React 构建一个小型 WebApp，供个人使用和一些经验:)

我想处理用户输入 -> 根据他将填写的位置数量，可能的“选项卡”或“按钮”数量会有所不同

在这个例子中，我创建了一个名为“data”的数组状态。

我想问您是否有更好的方法来处理这种情况，如果单击其中一个按钮，您将如何处理操作？

简单的普通事件监听器，然后继续在该函数中使用react还是完全不同？

我应该为创建的每个按钮同时创建一个 onClick={this.someFunc} 吗？

这是我的小 react 代码: http://pastebin.com/eseYdr3G

Answer 1

我认为你的想法是正确的。当您创建按钮时，您可以将其 id 设置为正确的名称，并设置其点击回调，如下所示:

return <button id={i[0]} onClick={this.handleClick}>{i[0]}</button>

(在这种情况下，ID 与名称相同，但您可以按照自己的喜好进行操作。)

然后你就可以在类中拥有你的处理程序:

handleClick: function(e) {
  e.preventDefault();
  var buttonName = e.target.id;
  // buttonName is the name of the button clicked
}