this.$refs[xxx].resetFields();方法常见于弹出框内搭配表单使用时调用，用于重置表单内容。这里解释一下resetFields()，其本质是初始化数据而不是清空数据，理解这个本质才能想明白在什么时候使用该方法才是正确的。
查看百度很多解决思路都是有问题的，说的半知半解甚至完全不搭边，首先resetFields()生效的前提条件有几点：
1.form上必须有ref属性，例如
<el-form :model="dataForm" :rules="dataRule" ref="dataForm">
这个ref随便定义，但要注意单组件内有多个form时ref不能重名
2.每个el-form-item上都要有prop属性，并且prop应该和绑定值名称保持一致
<el-form-item label="名称" prop="name">
<el-input
class="inline-input"
v-model="dataForm.name"
></el-input>
</el-form-item>
重置resetFields()方法不生效的解决方法：弹出框内的表单重置要在每次提交表单，关闭弹框前重置，可以直接在@close回调中写入，能解决弹出内所有情况的重置
<el-dialog :title="id ? '编辑工具' : '新增工具'" width="50%" :visible.sync="visible" @close="handleClose">
//关闭弹出时调用
handleClose() {
console.log('关闭')
this.$refs["dataForm"].resetFields(); // 提交后重置，不能打开时重置
}
误区：不要在进入弹出框时执行resetFields()方法来重置，而是在关闭弹出前重置
