昨天运行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. CentOS7.2 虚拟机网卡无法启动

    在开机之后,发现网卡没有启动起来,进行了如下操作1.ifup ens33Bringing up interface ens33: Error: Connection activation failed ...

  2. OpenCV中的图像形态学转换

    两个基本的形态学操作是腐蚀和膨胀.他们的变化构成了开运算,闭运算,梯度等.下面以这张图为例 1.腐蚀 这个操作会把前景物体的边界腐蚀掉. import cv2 import numpy as np i ...

  3. request response cookie session

    request 1. url传递参数 1)参数没有命名, 如: users/views def weather(request, city, year): print(city) print(year ...

  4. IDEA入门学习笔记1:资料收集

    IDEA2018软件下载 :https://mp.weixin.qq.com/s?__biz=MzIwMjE1MjMyMw==&mid=2650200056&idx=1&sn= ...

  5. markdown快捷键

    分组 功能 操作 快捷键 设置标题 一级标题 Heading1 Ctrl+1 二级标题 Heading2 Ctrl+2 三级标题 Heading3 Ctrl+3 四级标题 Heading4 Ctrl+ ...

  6. jmeter中基于oracle的JDBC Request的使用

    前提条件: 1.有数据库:2.数据库中有表,例如testuser(userid,username,usepwd): 设置如下: 参考自:http://www.linuxidc.com/Linux/20 ...

  7. UOJ 152 汉诺塔 分治

    题目链接 题意: 有三根编号为\((1, \, 2, \, 3)\)的柱子,然后第一根柱子上有编号为\(1 \sim n(n \leq 10000)\)的盘子,从上到下第\(i\)个盘子的编号是\(A ...

  8. BNU 3692 I18n 模拟

    题意: 在一篇文章中,单词可以缩写.例如单词Internationalization可以缩写为I18n,缩写的两端是原单词的首尾字母,中间的数字是被省略的字母的个数. 现在给你一篇缩写的文章,输出展开 ...

  9. NetCore 2.0 应用程序在centos 7上通过docker发布

    一  安装netcore 2.0 SDK 在centos 上面安装netcore 2.0 与window上面是不太一样的,注意,linux是不支持同时安装两个版本的.netcore SDK的,由于我之 ...

  10. Selenium WebDriver- actionchians模拟鼠标悬停操作

    #encoding=utf-8 import unittest import time from selenium import webdriver from selenium.webdriver i ...