vue中动态改变对象或是数组数据，页面能够实时刷新数据

很多时候我们改变了数据，但页面却没有实时更新，这是我们需要判断此时的值是否为响应的。我们试着打印对象或数组，当在控制台中显示的是这样的时候则图片中显示的所有字段均为响应式数据

若在控制台中直接显示字段对应的值：例如companyId，则说明这个字段不是响应的，需要通过一定的方法将其转换为响应式数据

vue中动态改变对象或是数组数据，保证页面也是跟着随时改变的，现有几种方法实现：

1、改变引用

data:{
    obj:{
        name:'gou',
        age:18
    }
},
直接更换变量引用

obj = {
    name:'gou',
    age:18，
    address:'beijin'
}

2、 数组使用数组函数

pop、push、splice，shift。。。。。

由于 JavaScript 的限制，Vue 不能检测以下数组的变动：

当你利用索引直接设置一个数组项时，
例如：vm.items[indexOfItem] = newValue
当你修改数组的长度时，
例如：vm.items.length = newLength
举个例子：

var vm = new Vue({
  data: {
    items: ['a', 'b', 'c']
  }
})
vm.items[1] = 'x' // 不是响应性的
vm.items.length = 2 // 不是响应性的

为了解决问题，可以使用如下方法：
修改第二个元素的值

list[1,2,3,4,5]

list.splice(1,1,5)

或者如需要修改数组length

arr.splice(newLength)

3、vue的set函数

对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性。但是，可以使用 Vue.set(object, propertyName, value) 方法向嵌套对象添加响应式属性。可尝试使用set方法

var vm = new Vue({
  data: {
    a: 1
  }
})
// `vm.a` 现在是响应式的

vm.b = 2
// `vm.b` 不是响应式的


obj:{
        name:'gou',
        age:18
    }
},

list = [1,2,3,4,5]

vm.$set(this.list,1,5);

vm.$set(vm.obj,'address','beijing')

使用sync属性：

列表组件中需对子组件中数据进行修改并页面实时改变

v-model.sync="scope.row.name"