在使用v-for的时候,如果渲染的数据是后端传过来的,不会有问题。
但是如果拿到数据后再进行增删改查,v-for渲染的时候就会出现不渲染之类的问题。
Ps:我遇到的问题是刷新页面之后不显示数据,但是随便找一个onclick的div点击一下,数据就出来了,纠结了很久,今天终于解决了,发个博文以免以后忘记。
这里粘一下Vue官网的解释:
由于 JavaScript 的限制,Vue 不能检测以下数组的变动:
- 当你利用索引直接设置一个数组项时,例如:
vm.items[indexOfItem] = newValue
- 当你修改数组的长度时,例如:
vm.items.length = newLength
简单地说就是对数组进行修改的时候,Vue没有检测到变化,所以也就不显示数据了。接下来提供了两种解决方案
vm.$set(vm.items, indexOfItem, newValue)
修改数组长度的话,则使用一下的方法
vm.items.splice(newLength)
如果是对后端返回的数组进行修改的话,是用第一种方法就可以完美解决了。
这里附上Vue官网的地址:https://cn.vuejs.org/v2/guide/list.html#%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9