element-ui表单(输入框)回显,无法进行编辑问题

1,078 阅读1分钟

面试题:new一个函数发生了什么?

bug描述

elementUI使用表单获取后台数据或者取本条列表数据,无法做修改删除等

图示如下:

image.png

原因

在Vue实例创建时,obj.b并未声明,因此就没有被Vue转换为响应式的属性,自然就不会触发视图的更新。

解决方法

<el-form-item label="全部包含">
  <el-input v-model="dataEdit.allRule" @input="changeFn" placeholder="全部包含" ></el-input>
</el-form-item>

// 主要是此行代码 @input="changeFn"

// 方法
changeFn() {
  this.$forceUpdate();
}

至此就解决了(ElementUi)表单回显无法编辑的问题