如何修复“React”警告：列表中的每个子项都应该有一个唯一的“key”prop“[重复]
我正在构建一个React APP来获取电影，并允许评论他们，还可以投票/率。用户可以对电影进行评论和投票。我所做的是制作一个选项标记，并使用map创建用户可以选择的评分值。
这是代码的一部分：
<FormGroup>
<Label for="rate">Rate(Out of 5)</Label>
<Input
type="select"
name="rate"
value={rate}
onChange={this.onChange}
style={{width: 200}}>
{ratings.map(rating => (
// eslint-disable-next-line react/jsx-key
<option>{rating}</option>
))}
</Input>
</FormGroup>
在选项标记行上，我得到以下错误：
Warning: Each child in a list should have a unique "key" prop.
我不知道如何摆脱这一警告，我想有一些建议，也为什么我会得到这一点，以便我可以避免它在未来。
我的代码完全在这里：https://pastebin.com/qvReLYPy
共有1个答案
-
在React（打字脚本）中，我得到： 警告：列表中的每个孩子都应该有一个唯一的“键”道具。检查MyCollection的渲染方法 这是： 这就是在父组件中调用它的方式： 如何获取唯一密钥以避免此警告？请注意，中的prop是中所有
-
我正在使用Nextjs开发一个电子商务网站，并正在查看myCart页面（订购物品列表） 代码为'http://localhost:5000/myCart'如下所示：myCart页面 我在导航栏中有一个购物车图标。当我点击它时，我被导航到我的购物车页面。已排序的列表将正确显示。但是在Dev工具中检查控制台时，我看到下面给出的警告。 同样，当我点击购物车图标时，页面会刷新并正确显示。此时，浏览器读取h
-
代码在这里 我在React Component的渲染方法中有上面的代码，并且我有key-value作为父div元素的属性。 警告：列表中的每个孩子都应该有一个唯一的“钥匙”道具。 如何解决？
-
我一直在调试这个，开始掉头发。到目前为止，我还没有找到解决办法。这是组件。我最初是为组件编写测试的，但是由于样式化的组件，它出现了一些错误，所以我的技术负责人告诉我为这个新的组件（这是组件中的新组件）编写测试，因为它可能有一些效果。运行<代码>摘要时。测验tsx我收到此错误（与钥匙相关）： 我的挑逗测试： 我的戏弄组件：
-
在这个简单的React应用程序中，我不明白为什么我会收到以下警告信息： 警告：列表中的每个孩子都应该有一个唯一的“键”道具。 对我来说，似乎我把密钥放在了正确的位置，形式为key={item.login.uuid} 我怎样才能摆脱警告信息？把钥匙放在哪里合适？ 应用程序。js 列表js
-
问题内容： 我正在使用Google Books API构建应用，并且似乎正在向列表中的每个孩子传递唯一键，但是错误不会消失。我一定在做错事，但不确定。 请注意，在返回const books之后，我有一个console.log（book.id），它将在控制台中显示所有10个唯一的id键。但是，当我尝试使用key = {book.id}将其传递给该组件的子组件时，会出现此错误。 问题答案： 在需要去最