ReactJS：从data-reactid属性轻松访问状态对象？

Question

我正在研究我的第一个反应应用程序。我注意到有助于元素的状态偶尔会反映在reactid中。也许这是通过的关键？ 我找不到关于reactid的大量文档，但我想知道是否有一种隔离这些密钥的好方法。

例如，我要更新的元素具有ID：.0.1.0.1.$4.3:$level.1 $表示我用于构建该DOM节点的状态对象的已知索引。 （具体来说，这是对象this.state.figures [4] .level）

如果我能用预定义的方法解析那些$值，那将非常棒，以便使setState变得容易。这样的事情存在吗？

这是我尝试在顶级祖先定义的事件上设置state，以避免繁琐的双向事件处理。我的做法真的很愚蠢吗？

Answer 1

如果我理解正确你想要根据他们的data-reactid将事件绑定到DOM节点？

如果是这样的话 - 我认为这根本不是一个明智的想法。 data-reactid属性是qutie transient，它会在没有警告的情况下发生变化，并受到React生态系统中许多事件的影响。

我喜欢将React生成的DOM视为编译目标，我甚至根本不应该与之交互。一个黑盒子，如果你愿意的话。

如果您需要帮助解决事件问题，您可能需要自己描述一下。

修改

你可以在React中添加事件处理程序，它们知道它们在迭代器中的位置，并且知道组件的当前状态。

<div>
  {
    things.map((thing, index) => {
      return (
        <li
          className="level"
          key={`level_${index}`}
          onClick={this.handleClick.bind(this, thing)}>
          { thing }
        </li>
      );
    });
  }
</div>

因此handleClick会在点击时收到thing项，这可以为您提供有关该特定内容的信息。你也可以传递索引。在handleClick中，您还可以访问this.state。