浅谈VUE， vue + elementui表单重置 resetFields问题（无法重置表单）

Posted 2021-03-03 yetiezhu

问题：

• elementui在重置表单时，无法使用this.$refs[‘formRefVal‘].resetFields()清空表单数据;
• elementui 设置rules后没有效果

解决方法：

第一步写入el-form，首先添加ref属性

 <el-form :model="form" ref="roleform"> </el-form>

第二步每一个 el-form-item标签里必须加上prop属性，属性名一定要对应表单里的每一个属性

<el-form-item label="姓名" :label-width="formLabelWidth" prop=‘_name‘>
      <el-input v-model="form._name" autocomplete="off"></el-input>
 </el-form-item>

第三步使用resetFields方法清空数据

 this.$refs.roleform.resetFields();

如果使用了$store.state.fm.plan管理关联表单数据，那么在form中需要添加:model="$store.state.fm"。