昨天运行vue项目的时候,出现了[Vue warn]: Duplicate keys detected: '0'. This may cause an update error(错误,检测到重复的key值:”0“,这可能会导致更新错误)

错误原因:

我们在使用v-for的时候,都要必须加上一个唯一的key值,但是这里写了两个for循环,尽管都加上了key值,然而又将key的值写成一样的了。所以就导致了警告。

解决办法:

可以将其中一个的key修改一下即可。

出错的地方:

写了两个一样的for循环,绑定的key相同。

<div class="info" v-for="(item, index) in itemList" :key="index"></div>
<div class="info" v-for="(item, index) in itemList" :key="index"></div>

可以修改其中一个的key值。

<div class="info" v-for="(item, index) in itemList" :key="'info-'+ index"></div>
<div class="info1" v-for="(item, index) in itemList" :key="'info1-'+ index"></div>

vue报错之Duplicate keys detected: '0'. This may cause an update error.的更多相关文章

  1. [Vue warn]: Duplicate keys detected: '0'. This may cause an update error.

    1.[Vue warn]: Duplicate keys detected: '0'. This may cause an update error. 第一眼看到这个错误一脸懵逼,项目使用很久了,代码 ...

  2. Duplicate keys detected: '0'. This may cause an update error.

    在运行vue项目的时候报了:[Vue warn]: Duplicate keys detected: ‘0’. This may cause an update error(错误,检测到重复的key值 ...

  3. [Vue warn]: Duplicate keys detected: 'area'. This may cause an update error.

    运行vue程序,浏览器报错: 原因:检测到重复的密钥:'area',因为在使用v-for循环绑定的时候,key的值是唯一的,不能相同,否则会出现意想不到的bug 解决办法:v-for时绑定的key唯一

  4. Vue报错 Duplicate keys detected: '1'. This may cause an update error. vue报错

    情况一.错误信息展示为关键字‘keys‘,此时应该检查for循环中的key,循环的key值不为唯一性 (很普通) 情况二.有两个相同的for循环,而这两个for循环的key值是一样的,此时将一个的ke ...

  5. [Vue warn]: Duplicate keys detected: '1'. This may cause an update error

    今天遇到这个问题,遇到这个问题多数因为:key值的问题 第一种情况(key重复) <div class="name-list" v-for="(item,index ...

  6. [VUE ERROR] Duplicate keys detected: 'tab-user'. This may cause an update error.

    错误消息如图: 如果你看到此错误消息,则说明 v-for 指令的 key值 重复了,只需修改你的 key值 让其不会重复即可.

  7. vue报错信息

    1.Property or method "xxx" is not defined on the instance but referenced during render. 原因 ...

  8. ElementUI使用v-if控制tab标签显示遇到的Duplicate keys detected: 'xxx'问题

    今天工作遇到一个问题: 需求背景:页面中有几个tab,需要根据登录用户的权限控制tab标签的显示与隐藏 . <el-tabs @tab-click="handleClick" ...

  9. vue安装之后的报错处理---chromedriver@2.35.0 install: `node install.js`

    报错:chromedriver@2.35.0 install: `node install.js` 这个错误的解决方法就是在你创建的项目目录,比如你创建的项目叫myVue,然后你就要在myVue这个目 ...

随机推荐

  1. React和Vue组件间数据传递demo

    一.React (一)父组件向子组件传数据 简单的向下传递参数 /* Parent */ class App extends Component { render() { return ( <d ...

  2. QT入门学习笔记2:QT例程

    转至:http://blog.51cto.com/9291927/2138876 Qt开发学习教程 一.Qt开发基础学习教程 本部分博客主要根据狄泰学院唐老师的<QT实验分析教程>创作,同 ...

  3. PEP-8 规范1

    代码布局 缩进 每个缩进级别使用4个空格. 延续线应使用Python的隐含线连接在括号,括号和大括号内,或使用悬挂缩进[7],垂直对齐包装元素.使用悬挂式凹痕时,应考虑以下因素;第一行应该没有参数,应 ...

  4. console_init()分析

    启动阶段初始化控制台流程分析, start_kernel console_init(); -->tty_ldisc_begin(); /* Setup the default TTY line ...

  5. hdu4861 我只能说这是找规律=.=

    先说明一下题意,因为开始我就没太读懂,感觉作者不是没交代清楚就是让做题的人自己去领悟,开始我不知道球是可以随便选的,然后那个关系式到底是最后一个数模p,还是整体模P........最后确定是整体模P ...

  6. 新线程 handler

    class CalculateThread extends Thread { private Handler handler; @Override public void run() { super. ...

  7. JAVA 基础--开发环境 vscode 搭建

    对于使用 Visual Studio Code 的 Java 开发者来说,Language Support for Java(TM) by Red Hat 扩展提供了非常好的语言特性支持,比如智能感知 ...

  8. Codeforces Round #473 (Div. 2)

    A. Mahmoud and Ehab and the even-odd game time limit per test 1 second memory limit per test 256 meg ...

  9. 【java基础 16】抽象类和接口的区别

    导读:前两天闲着没事儿,看了本书,然后写了点代码,在接口里面写了默认方法实现,因为书上说这个特性是从java8开始的,我还特地给测了一下java7. 没过几天,就有一个技术分享会,刚好也是讲java8 ...

  10. iOS-----openGL--openGL ES iOS 入门篇4---> 离屏渲染

    http://www.cnblogs.com/CoderAlex/p/6604618.html 通常情况下,我们使用openGL将渲染好的图片绘制到屏幕上,但有时候我们不想显示处理结果,这时候就需要使 ...