vue 值改变后界面没有变_VUE开发中，数据变化后，修改了绑定对象的属性值后，页面dom没有发生变化，两种方法可以重新渲染$set和$forceUpdate...

最近在开发中遇到一个在form表单对象里，有个图片上传的组件，上传成功后返回数据赋值后，图片没有展示出来

当我上传图片成功后给form.imgUrl赋值后，页面并没有出现图片的缩略图

该怎么解决呢：

方法1.$set

// 上传成功回调函数

handleAvatarSuccess(res, file) {

this.$set(this.form,'imgUrl',res.data);

},

方法2.$forceUpdate

handleAvatarSuccess(res, file) {

this.form.imgUrl = res.data;

this.$forceUpdate();

},

$set官方api

vm.$set( target, propertyName/index, value )

参数：

{Object | Array} target

{string | number} propertyName/index

{any} value

返回值：设置的值。

用法：

这是全局 Vue.set 的别名。

$forceUpdate

迫使 Vue 实例重新渲染。注意它仅仅影响实例本身和插入插槽内容的子组件，而不是所有子组件。

解决后成功渲染good