为什么我应该在 React 中使用 key 作为列表项的字符串？

Question

React Doc 解释了为什么为列表项提供键很重要。它指定键是字符串属性。

那么我应该每次都将我的 id 转换为字符串作为密钥吗？

<ul>
  {data.map(item => (
    <li key={item.id.toString()}>
      {item.text}
    </li>
</ul>

你能告诉我这是什么原因吗？我考虑过数字排序作为字符串的问题，但这似乎是另一种情况。

反应文档。列表和键

Answer 1

Key 是 React 在渲染过程（后台）索引列表的基础。如果你不输入密钥，你会得到这个：

这仅仅意味着他需要寻找元件，这会花费更长的时间。

要解决 toString() 问题，请执行以下操作：

key={`OperationTesterInput_${idx}`

看起来干净多了。您还可以使用地图函数中存在的索引参数，也可以做到这一点:)

它是字符串的原因

它不是。原因是因为打字稿。其实现如下：

因此，按照此实现，这是有效的：