vue3 + elementPlus reset重置表单
vue3 + elementPlus reset重置表单
·
1.表单需加上ref属性
2.字段需加上prop属性
elementplus表单链接
实际使用
- 加上ref=“ruleFormRef” 和prop=“userId”
<el-form :model="ruleForm" label-width="120px" ref="ruleFormRef" :rules="rules">
<el-form-item label="账号:" prop="userId">
<el-input v-model="ruleForm.userId" placeholder="请输入您的邮箱" />
</el-form-item>
</el-form-item>
</el-form>
//字段赋值
const ruleForm = reactive({
userId: ""
});
2.给重置按钮写上@click
<el-button @click="resetForm(ruleFormRef)">重填</el-button>
3.编写@click事件
const resetForm = (ruleForm: FormInstance | undefined) => {
if (!ruleForm) return;
ruleForm.resetFields();
};
更多推荐
已为社区贡献7条内容
所有评论(0)