Array.map 在 React-Native 中两次渲染给定数据答案

【问题标题】：Array.map rendering the given data twice in React-NativeArray.map 在 React-Native 中两次渲染给定数据
【发布时间】：2021-11-14 20:37:22
【问题描述】：

我有在 React Native 中使用 map 渲染的数据数组。但是组件渲染数据两次并抛出异常

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

这是我的代码。

  const test = ["Test1","Test2","Test3" ]

<View>
 {test.map(item=><Text>{item}</Text> )}
</View>

【问题讨论】：

【解决方案1】：

警告：列表中的每个孩子都应该有一个唯一的“key”道具。

正如它所说的......这只是一个警告

这可以通过向您的<Text> 添加一些唯一键来解决

const test = ["Test1", "Test2", "Test3"];
<View>
  {test.map((item, index) => <Text key={index}>{item}</Text> )}
</View>

在某些用例中值得一提的是using index as key is anti-pattern。

您给我们的样品，数据应该只打印一次

【讨论】：