不回显代码如下:

data(){
	return{
		form: {},
		}
}

handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then(response => {
      	this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        this.form.postIds = response.postIds;
        this.form.roleId = response.roleIds[0];
        this.open = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },

可以回显的代码

data(){
	return{
		form: {},
		}
}

handleUpdate(row) {
      this.reset();
      const userId = row.userId || this.ids;
      getUser(userId).then(response => {
        response.data.postIds = response.postIds;
        response.data.roleId = response.roleIds[0];
      	this.form = response.data;
        this.postOptions = response.posts;
        this.roleOptions = response.roles;
        // this.form.postIds = response.postIds;
        // this.form.roleId = response.roleIds[0];
        this.open = true;
        this.title = "修改用户";
        this.form.password = "";
      });
    },

由于表单数据较多,所以我们在定义data的时候直接定义为空对象进行初始化,这样对象中的字段在赋值的时候是不存在响应式的

解决方式:
1.如上代码:直接给form表单赋值,不单独给某个属性赋值;
2.如果想单独赋值,使用this.$set(this.form,“roleId”,response.roleIds[0])
this. $set(this.form,"roleId",response.roleIds[0])

Logo

前往低代码交流专区

更多推荐