我们使用vue会碰到数据更新,但是视图并未改变的情况。
造成的原因是:
因为vue的检查机制在进行视图更新时无法监测 数组中的某个对象的属性值的变化。
解决方案:
- $forceUpdate() vue自带的强制更新
this.$forceUpdate() 强制视图更新
- Vue.set()
Vue.set( target, propertyName/index, value )
参数:
target:要修改的对象或数组
propertyName/index:属性或下标
value:修改后的value值
- Object.assign()
方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。方法只会拷贝源对象自身的并且可枚举的属性到目标对象。直接使用Object.assign()添加到对象的新属性不会触发更新,应创建一个新的对象,合并原对象和混入对象的属性
vue3是用过proxy实现数据响应式的,直接动态添加新属性仍可以实现数据响应式