在复杂的 React 组件中查找重复的键

2024-02-02

我有一个反应组件,它一次生成许多键,我不确定哪个不是唯一的。错误如下。有什么简单的方法可以帮助调试吗?谢谢!

React.js:19500 警告:数组或迭代器中的每个子项都应该有一个唯一的“key”属性。检查渲染方法MyGrid。请参阅 https://fb.me/react-warning-keys 了解更多信息。


这是一个警告,表明您尚未分配密钥,而不是它实际上不是唯一的,消息的下一行应该准确地告诉您有问题的元素是什么 - 请参阅下面的示例in div (created by CardsComponent)

warning.js:36 Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `CardsComponent`. See fb.me/react-warning-keys for more information. in div (created by CardsComponent)

如果你想进一步调试,测试是在ReactElementValidator.validateExplicitKey它只是检查元素键是否非空,不检查兄弟键之间的唯一性......

function validateExplicitKey(element, parentType) {
  if (!element._store || element._store.validated || element.key != null) {
    return;
  }
  // if it gets here it has failed and you will be warned

这里有趣的部分是element.key != null当其他人通过已经被验证的美德时

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在复杂的 React 组件中查找重复的键 的相关文章

随机推荐

  • 一个好的 Java 排序列表

    我正在寻找一个好的java排序列表 谷歌搜索给了我一些关于使用 TreeSet TreeMap 的提示 但这些组件缺少一件事 随机访问集合中的元素 例如 我想访问排序集中的第 n 个元素 但对于 TreeSet 我必须迭代其他 n 1 个元
  • tkinter 小部件 ipad(x/y) 的工作方式与 pad(x,y) 不同

    我可以自定义外部填充所有四个侧面tkinter 小部件的使用 widget grid 0 0 padx left pad right pad pady top pad bottom pad 但是 当我更换padx and pady with
  • 对所有数组元素进行类型检查

    是否有任何简单的方法可以检查数组的所有元素是否都是特定类型的实例 而无需循环所有元素 或者至少有一种从数组中获取 X 类型的所有元素的简单方法 s array abd 10 10 1 s array map gettype s t arra
  • 函数的右值引用和返回值

    我是 c 11 的新手 在阅读时有以下问题C 11 常见问题解答 http www stroustrup com C 11FAQ html rval 假设我们有一个函数f 返回类型的值X 那么我们有以下几种方式来存储它的返回值 X a f
  • 无法更改 Google Cardboard 相机的 FOV

    我正在使用 Google Card Board Unity SDK 开发 Android 狙击手游戏 现在需要调整相机的 FOV 这导致我与 CardBoard cs 中名为 mockFieldOfView 的变量进行交互 在 Unity
  • Vue-cli 3:“命令失败:npm install --loglevel 错误”

    每次我尝试创建一个新项目 vue create my project 我收到此错误 错误 命令失败 npm install loglevel 错误 我使用的是 PC Windows 10 Vue cli 3 2 1 Node 8 11 3
  • 如何将 ReadonlyArray 转换为 any[]?

    一些本机角度函数返回 ReadonlyArray 一些本机角度回调传递 ReadonlyArrays 由于我的打字稿代码可能以多种方式调用 因此我不想要求传递给我的函数的所有数组都是 ReadonlyArrays 因此我需要将 Readon
  • 在 Android 中使用新 Material Design 主题的颜色

    我正在设计 Android 应用程序 并决定尝试新的 Material 主题 我在网上找到了新主题的所有可用配色方案 但无法找到包含调色板中所有颜色的相应 xml 文件 有谁知道我在哪里可以找到这个 以便我可以在我的风格中使用这些颜色 这是
  • 无法将脚本名称识别为 cmdlet、函数等;在简单的脚本中也找不到位置参数

    我正在尝试做我的第一个剧本 要简单地让 PowerShell 提取在记事本中输入的脚本并保存为标题为 test 的 ps1 文件 也尝试过脚本 但知道名称与它无关 Write Host Hello World 在 PowerShell 中我
  • ImageView和设置位置

    我有 imageView 活动 我如何在我的活动中设置此 imageView 的位置 我知道如何在 xml 文件中执行此操作 但我想在活动中执行此操作 因为我有 onTouch 方法 可以在其中获取单击的坐标 并且我想在此坐标中绘制此图像
  • 编辑链接列表中的节点

    我正在创建一个学生列表 链接列表 可以添加 查看和编辑学生信息 我有两个字段 即学生姓名和学生成绩 我在列表中添加新学生 其方式是根据学生的成绩降序排列 我已经完成了添加和查看部分 问题出在编辑部分 因为我需要编辑信息 然后我需要再次对其进
  • 将数据表放入shinyjs模式中

    我将 Shiny 与 Shiny Semantic 库一起使用 以使应用程序看起来不错 使用 showModal modalDialog 的标准 Shiny 弹出消息不适用于 Semantic UI 因此我求助于shinyjs 来使用一些
  • 使用 Javascript 更改 CSS 值

    使用 javascript 设置内联 CSS 值很容易 如果我想改变宽度并且我有这样的html div style width 10px div 我需要做的就是 document getElementById id style width
  • 单选按钮组 XAML

    我在 XAML 中有六个单选按钮 我想创建两个组 WPF 似乎没有单选按钮组元素 那么我该怎么做呢 您必须为元素指定一个 GroupName
  • dockerfile 中的 RUN 命令产生的结果与在容器内手动运行相同命令的结果不同

    我正在创建一个包含 gcc 4 8 5 的 Ubuntu 12 04 docker 映像 我正在获取 gcc 4 8 5 源代码并自己构建它 该容器将在 Ubuntu 18 04 主机上运行 引用底部的代码 如果我不将其放入 dockerf
  • 加密 JWT 安全令牌支持的算法

    我正在尝试使用以下代码片段对我的 JWt 进行签名和编码 var claims new Claim new SomeClaimes var scKey Encoding UTF8 GetBytes SOME KEY var ecKey En
  • 从单个单词中获取所有可能的词性标签

    我目前正在尝试使用 Python 获取单个单词的所有可能的 pos 标签 从传统的词性标注器中 如果您输入单个单词 您只能返回一个标签 有没有办法获得所有的可能性 是否可以在语料库 例如 Brown 中搜索特定单词而不仅仅是类别 亲切的问候
  • 在 Javascript 中处理多个图像后备

    有没有办法在纯 Javascript 或 React 中处理多个图像回退 我知道我们可以处理一张后备图像onError 如果我们想做另一个后备图像怎么办 提前致谢 每次设置导致错误的 src 时 都会调用图像的 onerror 回调 因此
  • 如何使用 Pipe 和 purrr 获取列表名称和切片名称

    我想知道在使用 purrr 的管道操作时如何获取列表名称或组名称作为标志 例如 我想使用传递给 ggsave 函数的每个列表名称的动态参数 require purrr require ggplot2 lst list a1 data fra
  • 在复杂的 React 组件中查找重复的键

    我有一个反应组件 它一次生成许多键 我不确定哪个不是唯一的 错误如下 有什么简单的方法可以帮助调试吗 谢谢 React js 19500 警告 数组或迭代器中的每个子项都应该有一个唯一的 key 属性 检查渲染方法MyGrid 请参阅 ht