即使添加后也反应关键道具错误答案

【问题标题】：React key prop error even after adding it即使添加后也反应关键道具错误
【发布时间】：2021-09-05 05:22:57
【问题描述】：

警告：数组或迭代器中的每个孩子都应该有一个唯一的“key”道具。使用 .

检查顶级渲染调用

我已经为我的代码中的每个 ul 标签添加了 key prop，但错误仍未解决。我也尝试在返回 div 标签内添加主键道具。

在反应。错误消息总是告诉你有问题的组件，但不告诉你有问题的特定 HTML 标记/虚拟 DOM 元素。在包含大型组件的大型代码库中工作，这使得查找错误来源变得非常困难。

var View = deviceTypes.map((deviceType,idx) => {
            
        );
    }

【问题讨论】：

能否请您记录您的devices 对象？

标签： javascript reactjs ruby-on-rails key

【解决方案1】：

您需要将唯一的key 放在包裹ul 的div 中

                var imageView   = (<div key={idx} className={ImageBackGround}>
                    {image}

                    {typeof operationView!='undefined' &&  <div className= {typeof operationView=='undefined'?'':'mt-overlay'}>
                        <ul key={idx} className="mt-info">
                            {operationView}
                        </ul>
                    </div>}

                </div>);

【讨论】：

【解决方案2】：

这个 div 是唯一需要键的元素：

var deviceView = deviceTypeData.map((deviceData) => {
  //...
  return (
     <div className="col-lg-3 col-md-4 col-sm-6 col-xs-12">
       //...
     </div>
  );
});

【讨论】：

谢谢，我已经试过了，但仍然错误提示要检查顶级