Html 子对象的唯一标识符

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

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

如果我只有React元素，我将使用

键

，但我还必须处理html元素

我无法使用

id

，因为我的应用程序与其他应用程序一起嵌入到页面中，可能存在冲突

我目前使用的是

title

，但是当用户将鼠标悬停在元素上时，标识符显示出来，所以看起来不太好

---

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

您可以始终使用一个属性，例如

数据唯一id=“1”

好的属性！这是否意味着我需要两个不同的名称，

data-unique-id

用于html属性，而

dataUniqueId

用于React-props？如果不是cameCase，那么您必须像

this.props['data-unique-id']

一样在组件内部访问它。如果camelCase像

dataUniqueId

一样，你可以像普通道具

一样使用这个.props.dataUniqueId

详细回答如下：