elementui form 表单数据不置空问题

最近在使用elementui 中的form表单遇到的一个诡异的问题，我form表单外面嵌套着一个dialog,当我新建一个form对象是，使用官网提供的 this.$refs.form.resetFields()我有效果的，但是当我给form手动赋值后，再重新点开form，内容并没有清空

输入内容清空正常：

image.png

手动赋值，重新再打开form,不能清空内容

image.png

后面经过在网上查帖子，可算解决了这个问题。
当我们遇到这样的问题时，可以尝试按以下方式进行排查错误：

1、form是否设置ref

2、form中每一项是否设置了prop

3、是否因为缺少了$nextTick函数？

<el-dialog title="模板编辑" width="40%" :visible.sync="visibleDialog" @close="close">
            <el-form :model="roleForm" label-width="100px" ref="form">
                <el-form-item label="模板名称"  prop="name">
                    <el-input  v-model="roleForm.name" autocomplete="off" style="width: 220px"></el-input>

                </el-form-item>
                <el-form-item label="模板id" prop="templateId" >
                    <el-input type="textarea" :rows="2"  v-model="roleForm.templateId" autocomplete="off" 
style="width: 220px"></el-input>
                </el-form-item>
                <el-form-item label="模板路径"  prop="baseUrl">
                    <el-input type="textarea" :rows="2"  v-model="roleForm.baseUrl" autocomplete="off" 
style="width: 220px"></el-input>
                </el-form-item>
                <el-form-item label="模板类名"  prop="className">
                    <el-input type="textarea" :rows="2"  v-model="roleForm.className" autocomplete="off" 
style="width: 220px"></el-input>
                </el-form-item>
 </el-form>
</el-dialog>

// 赋值
  handleEdit(index,row) {
                this.visibleDialog = true
                this.updateType = 'editor'
                this.$nextTick(()=>{
                    this.roleForm = Object.assign({},row)
                })
 },
// 关闭dialog时回调
 close(){ // 表单关闭置空字段（不展示的字段是无法置空的）
                this.$refs.form.resetFields()
   },