详解Vue中使用v-for语句抛出错误的解决方案
更新时间：2017年05月04日 08:50:57 作者：xjlinme
本篇文章主要介绍了详解Vue中使用v-for语句抛出错误的解决方案，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
Vue 中使用v-for语句抛出错误的解决方案
今天在维护以前的项目的时候遇见了下面的报错情况，开始我以为是因为jQuery和Vue冲突了，所以把以前的jQuery改了，但是还是出现同样的错误…通过查阅资料，发现是因为循环的变量里面的值重复了，导致Vue报错。
复制代码 代码如下:
Uncaught (in promise) TypeError: Cannot read property ‘removeChild' of null
接下来查了一下解决方案，发现在Vue 2.0之前的版本可以通过在v-for语句后面加如下语句解决：
<div v-for="item in items" track-by="id">
不过在Vue 2.0之后的版本中track-by改为了key，所以对于Vue 2.0之后的版本可以使用：
<div v-for="item in items" v-bind:key="item.id">
其实，在查看API返回的JSON数据后，发现重复请求了接口，所以，这个问题本来就不应该出现的。所以特意在接口获取数据的地方加上了一个过滤方法：
self.goodsList.indexOf(arr) === -1 ? self.goodsList.push(arr) : undefined
这句语句就是说如果获取的数组元素不重复的话，才将数组元素加入到列表中。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
本文主要介绍了vue实现微信公众号h5跳转小程序的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-08-08
这篇文章主要介绍了vue3项目使用样式穿透修改elementUI默认样式,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-03-03
这篇文章主要介绍了vue如何导出json数据为excel表格并保存到本地问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
网上有不少使用mockjs模拟数据的文章，但基本都是本地拦截请求返回数据，本文主要介绍了vue-cli实现异步请求返回mock模拟数据，文中根据实例编码详细介绍的十分详尽，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-03-03
仿照e签宝,实现pdf电子签章 => 拿到pdf链接,移动章的位置,获取章的坐标,怎么实现呢,下面小编给大家介绍vue2实现pdf电子签章问题记录,感兴趣的朋友一起看看吧2023-12-12
本文通过基本实例给大家介绍了vue计算属性和监听器的相关知识，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下2018-05-05
这篇文章主要介绍了vue elementUI 表单校验（数组多层嵌套）功能的实例代码，代码简单易懂，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-06-06
vue前端项目发布的时候,打包可实现gzip格式的压缩,下面这篇文章主要给大家介绍了关于Vite打包性能优化之开启Gzip压缩的相关资料,需要的朋友可以参考下2022-12-12
vue是一套用于构建用户界面的渐进式框架。接下来通过本文给大家分享Vue.js下载方式及基本概念，感兴趣的朋友跟随脚本之家小编一起学习吧2018-05-05
这篇文章主要为大家详细介绍了Vue实现商品放大镜效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
最新评论