Reactjs 子项的唯一标识符

编程问答 2022-08-06

问题描述

我需要一个 Reactjs 组件的子组件的唯一标识符。这是 JSX 伪代码：

<ParentComponent>
  <htmlElement1 uniqueIdentifier="htmlElement1" />
  <htmlElement2 uniqueIdentifier="htmlElement2" />
  <ReactElement1 uniqueIdentifier="ReactElement1" />
  <ReactElement2 uniqueIdentifier="ReactElement2" />
</ParentComponent>

如果我只有 React 元素，我会使用 key，但我还必须处理 html 元素。

我无法使用 id，因为我的应用与其他应用一起嵌入在页面中，并且可能存在冲突。

我目前正在使用 title，但它看起来不太好，因为当用户将鼠标悬停在元素上时会显示标识符。

你能推荐一个更好的属性/道具吗？

解决方法

您始终可以使用 data-* 属性，例如 data-unique-id="1"

attributeshtmljsxjsxreactjsreactjs