Vue 中操作 data 的数组方法哪些可以触发视图更新?

900 阅读1分钟

一、在vue中操作data的数组方法有以下几个方法可以触发视图更新:

     push()、pop()、shift()、unshift()、splice()、sort()、reverse()以上这些方法会改变被操作的数组;

     filter()、concat()、 slice()  这些方法不会改变被操作的数组,返回一个新的数组;

     以上方法都可以触发视图更新。
     
     

二、不能触发视图更新的方法有以下几种:

    利用索引直接设置一个数组项,例:this.array[index] = newValue

    直接修改数组的长度,例:this.array.length = newLength

    以上两种方法不可以触发视图更新;
    

三、有以下两种方法可以解决不能触发视图更新:

    解决方法 1: 可以用 this.$set(this.array,index,newValue) 或this.array.splice(index,1,newValue)

    解决方法 2: 可以用 this.array.splice(newLength)