昨天运行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. 李涛ps高手之路

    下载地址:http://www.ly89.cn/detailR/21.html

  2. Java代码中的(解压7z加密版)

    maven:需要加上这个下载这两个包 <dependency> <groupId>net.sf.sevenzipjbinding</groupId> <art ...

  3. Python之路--序列化

    序列化的目的 1.以某种存储形式使自定义对象持久化 2.将对象从一个地方传递到另一个地方 3.使程序更具有维护性 json json多语言通用 四个功能:dumps.dump.loads.load # ...

  4. selenium2中的TestNg注解和数据驱动的简介及使用

    TestNg常用注解介绍,先来张图: 先看一下,以上各个注释的运行次序: @Test 表示的意义:    1.表示示该方法是一个测试方法,在运行时,会自动的运行有@Test注脚的方法. 示例: @Be ...

  5. loj2026 「JLOI / SHOI2016」成绩比较

    orz #include <iostream> #include <cstdio> using namespace std; typedef long long ll; int ...

  6. day03_07 变量的重新赋值01

    在cmd中退出python,需要使用quit()命令 name = "Alex Li" name2 = name print(name,name2) name = "Ja ...

  7. 使用phppgadmin 遇到的小问题

    无法登录,显示错误消息如下: Error:login disallowed for security reasons. 解决方法: 修改conf/config.inc.php文件中的extra_log ...

  8. php 审批流程管理

    1.流程管理的用法是什么样的? 2.怎么发起想要的流程? 3.审批的人要是怎么审批通过? 4.流程审核是不是要挨个走过? 一.要有数据库的内容的 肯定会有表的,首先就是用户表了,然后就是流程表,用户编 ...

  9. [译]pycache是什么?

    原回答: https://stackoverflow.com/questions/16869024/what-is-pycache 当你用python运行一个程序时,解释器首先将它编译成字节码(这是一 ...

  10. pytorch下可采用visidom作为可视化工具

    2018/9/18更新  感觉tensorboardX插件更好用,已转用https://github.com/lanpa/tensorboardX 更新:新版visdom0.1.7安装方式为:cond ...