先定义一个变量,变量名可以自己谁便取

let formlabelref = ref()

然后将这个变量绑定到 el-form上,需要一个ref属性

<el-form ref="formlabelref" :model="userPasswordInfo"  :rules="rules" label-width="100px" size="large">

给重置的按钮绑定一个点击事件

<el-button @click="resetForm()">重置</el-button>

定义方法,进行数据清空

// 还需要导入unref哦,这个不要忘记
import { ref,unref } from 'vue'
const resetForm = ()=>{
   const form = unref(formlabelref)
   form.resetFields()
}

最后就完成啦,自己也试了一下,可以清空数据和表单校验啦!


记录一下,因为官网用的是typescript,我试了一下官网的,也试了下这个,感觉这个更好用一点。语法也比官网简单一点。

最后修改:2024 年 02 月 14 日
如果觉得我的文章对你有用,请随意赞赏