在学习vue过程中遇到Elements in iteration expect to have 'v-bind:key' directives.' 这个错误，查阅资料得知Vue 2.2.0+的版本里，当在组件中使用v-for时，key是必须设置的。

解决方式一：设置对应的key

注意上面key值不要用对象或是数组作为key，用string或number作为key，否则报错：[Vue warn] Avoid using non-primitive value as key, use string/number value instead.

解决方式二：更改VS Code编辑器的vetur配置（vscode->文件->首选项->设置->搜索（vetur））

　　　将"vetur.validation.template": true, 改成"vetur.validation.template": false, 即可

两种方式对比，建议还是用第一种方式，:key相当于是索引的作用，提高循环性能

Elements in iteration expect to have 'v-bind:key' directives.' 提示错误如何解决？的更多相关文章

  1. vue开发中v-for在Eslint的规则检查下出现：Elements in iteration expect to have 'v-bind:key' directives

    在使用VScode编辑器vue开发过程中,v-for在Eslint的规则检查下出现报错:Elements in iteration expect to have 'v-bind:key' direct ...

  2. v-for 在 VSCode 中出现 Elements in iteration expect to have 'v-bind:key' directives.

    在 VSCode 中编辑代码时,在有 v-for 的语句下面有一条红色波浪线,鼠标放上去有提示 Elements in iteration expect to have 'v-bind:key' di ...

  3. vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives

    vue使用v-for时vscode报错 Elements in iteration expect to have 'v-bind:key' directives Vue 2.2.0+的版本里,当在组件 ...

  4. vetur插件提示 [vue-language-server] Elements in iteration expect to have 'v-bind:key' directives错误的解决办法

    错误提示: [vue-language-server] Elements in iteration expect to have 'v-bind:key' directives.Renders the ...

  5. vetur插件提示 [vue-language-server] Elements in iteration expect to have 'v-bind:key' directives

    错误如下图所示: 错误提示: [vue-language-server] Elements in iteration expect to have 'v-bind:key' directives.Re ...

  6. 遇到Elements in iteration expect to have 'v-bind:key' directives.' 这个错误

    解决方式一:更改VS Code编辑器的vetur配置 错误提示: [vue-language-server] Elements in iteration expect to have 'v-bind: ...

  7. Elements in iteration expect to have 'v-bind:key' directives错误的解决办法

    一.错误如下 [eslint-plugin-vue][vue/require-v-for-key]Elements in iteration expect to have 'v-bind:key' d ...

  8. vue的开发中v-for报错 [vue/require-v-for-key] Elements in iteration expect to have 'v-bind:key' directives.

    用的VS Code 工具,安装了vetur插件,报错了如下 [eslint-plugin-vue] [vue/require-v-for-key] Elements in iteration expe ...

  9. [vue/require-v-for-key] Elements in iteration expect to have 'v-bind:key' directives.

    使用VScode开发vue中,v-for在Eslint的规则检查下出现报错:如下Elements in iteration expect to have ‘v-bind:key’ directives ...

随机推荐

  1. Spring面试，IoC和AOP的理解（转）

    spring 的优点?1.降低了组件之间的耦合性 ,实现了软件各层之间的解耦 2.可以使用容易提供的众多服务,如事务管理,消息服务等 3.容器提供单例模式支持 4.容器提供了AOP技术,利用它很容易实 ...

  2. HDU 4771 (DFS+BFS)

    Problem Description Harry Potter has some precious. For example, his invisible robe, his wand and hi ...

  3. android 布局文件中控件ID、name标签属性的命名包含“@”、“.”、“+”等等符号的含义

    1. 在项目的根目录有个配置文件“AndroidManifest.xml”,是用来设置Activity的属性的如 <?xml version="1.0" encoding=& ...

  4. svg学习

    百度百科: SVG可缩放矢量图形(Scalable Vector Graphics)是基于可扩展标记语言(XML),用于描述二维矢量图形的一种图形格式.SVG是W3C制定的一种新的二维矢量图形格式,也 ...

  5. 【c#】winform 上传图片

    1.拖拽上传图片 1.1.后台代码中修改窗体属性,添加 AllowDrop = true 1.2.给窗体添加拖拽事件,在事件列表找到拖拽 双击即可: 在 DragDrop 生成的方法中添加代码如下: ...

  6. JAVA--未明确定义列

    原因:列明重复 可以加前缀或区别名以区分

  7. [洛谷P2051] [AHOI2009]中国象棋

    洛谷题目链接:[AHOI2009]中国象棋 题目描述 这次小可可想解决的难题和中国象棋有关,在一个N行M列的棋盘上,让你放若干个炮(可以是0个),使得没有一个炮可以攻击到另一个炮,请问有多少种放置方法 ...

  8. Mybatis中select传递多个参数

    一.单个参数: public List<XXBean> getXXBeanList(String xxCode); <select id="getXXXBeanList&q ...

  9. Windows下端口占用查看

    假如我们需要确定谁占用了我们的80端口 1.Windows平台在windows命令行窗口下执行:C:\>netstat -aon|findstr "80" TCP     1 ...

  10. 【BZOJ】1724 [Usaco2006 Nov]Fence Repair 切割木板

    [算法]贪心+堆 #include<cstdio> #include<algorithm> using namespace std; ; int n,heap[maxn],sz ...