Vue对象响应规则

当我们修改与组件绑定的数据时，一般直接进行赋值后，数据绑定的组件也会相应作出UI更新。但是某些特殊的情况下，修改数据后，需要调用Vue中特定的方法才能更新组件UI。其中一种情况，便是该修改的数据是一个对象，然后要往添加新的属性。此时如果直接赋值，数据绑定的组件UI不会更新。要解决这个问题，需要遵守一些注意事项：

• 最好先初始化好所有所需属性。
• 当需要在对象上添加新属性时，你应该使用

Vue.set(obj, 'newProp', 123) 

或者以新对象替换老对象。如下：

state.obj = { ...obj, newProp: 123 }

或使用Object.assign(obj, newObj)方法:

newObj.newProp = 123
Object.assign(obj, newObj)

此规则同样适用于Vuex的Mutation中。