Element UI 表单清空异常（resetFields无法清空表单）

问题描述

使用表单对列表的信息进行编辑，点击【取消】按钮关闭表单并调用resetFields清空表单的值。
第一次可以清空，但是再次点击【取消】按钮，表单自动填充第一次表单的值，并没有清空。

解决方法

弹出表单后不要直接对form赋值，将赋值语句放在
this.$nextTick(() => {// 这里对表单进行赋值})
代码示例

handleUpdate (row) {
   this.dialogFormVisible = true
   this.$nextTick(() => {
     this.form = Object.assign({}, row) // 给表单赋值
   })
 }
 cancel () {
   this.dialogFormVisible = false
   this.$refs['dataForm'].resetFields()
 }

原因

这个问题的本质是因为你编辑时，第一次打开dialog的时候给表单绑定的model赋值了，这时候这个model的初始值就变成了你所赋值的值，所以resetFields的时候，会将model对应的每个值重置到初始值，这时候的初始值就是你编辑时赋值的那个值，而不是在data里声明的初始值，解决方式是，等dialog已经初始化mounted之后再给model赋值，也就是
this.$nextTick(() => { // 这里开始赋值 this.form.xxx = xxx; })