vue set的使用

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/kangkang_style/article/details/88825852

受 ES5 的限制，Vue.js 不能检测到以下响应式界面更新：
    1. 数组中某一项的变动
        例如：
            arr: [1,2,3,4]
            this.arr[0] = 5
            
    2. 数组长度的改变
        例如：
            arr: [1,2,3,4]
            this.arr.length = 5
            
    3. 对象属性的添加或删除
        例如：
            arr: { name: '', age: '' }
            this.arr.sex = ''

实测效果：
    有些时候实际测试，会发现vue.js其实是可以检测到这些变化的，但不一定
    
vue.js提供了 vue set方法针对以上情况，触发响应视图的更新

语法：
    对象：Vue.set( target, key, value )
    数组：Vue.set( target, index, value )
    
根据上面3种情况依次举例：
    1. 数组中某一项的变动
        arr: [1,2,3,4]
        this.$set(arr, 0, 5)
        
    2. 数组长度的改变
        arr: [1,2,3,4]
        this.$set(arr, 5, '')
        
    3. 对象属性的添加或删除
        arr: { name: '', age: '' }
        this.$set(arr, 'sex', '')
注意：    
    this.$set()和Vue.set()本质方法一样，前者可以用在methods中使用。