列表中的每个子元素都应该有一个唯一的“key”属性，控制台警告。

Question

26 浏览2023年5月20日

匿名的 2022年5月13日

0 Comments

这个问题已经有了答案：

理解React.js中数组子元素的唯一键

警告：列表中的每个子元素应该有一个唯一的“key”属性

代码如下

   
        {[{ title: "Js, values: ["s1", "s2"]}].map((f_list) => (
            
            {f_list.values.map((f_list_value) => (
              
            ))}
        ))}

我在React组件的render方法中有上面的代码，并且我已经将key-value作为父级div元素的属性。不过，我仍然在控制台中收到以下错误：

警告：列表中的每个子元素应该有一个唯一的“key”属性。

这个问题应该如何解决？

admin 更改状态以发布 2023年5月20日

0

2 答案

匿名的 · Answer 1 · 2022-05-13T20:57:58+00:00

你可以通过以下代码进行修复：

{f_list.values.map((f_list_value, index) => (
   
))}

如果你渲染一个元素列表，你必须添加一个额外的属性 key。此属性可以唯一地标识你的元素。

匿名的 · Answer 2 · 2022-05-13T20:57:58+00:00

您也需要为按钮指定一个 key：

{f_list.values.map((f_list_value, idx) => (
    
))}