第elementui提交表單返回成功后自動(dòng)清空表單的值的實(shí)現(xiàn)代碼在實(shí)際開發(fā)中，新增彈窗的form表單中輸入內(nèi)容后，新增成功后應(yīng)該把form表單清空，不然下次再進(jìn)入新增彈窗時(shí)，會(huì)有上次新增完的內(nèi)容

方法一：form表單項(xiàng)少的話可以選擇手動(dòng)刪除：

this.loginForm={

name:'',

username:'',

password:'',

confirm:'',

department:'',

phone:''

方法二：以上的方法當(dāng)然也是可以的，但是如果form表單有很多項(xiàng)的話，你需要寫很多清空代碼；

elementui中的form提供resetFields方法，用于清空所有表單數(shù)據(jù)，前提是表單項(xiàng)中要使用prop屬性，綁定input中的v-model所綁定的字段，才可以被清空：

this.$nextTick(()={

if(this.$refs.loginForm){

//this.$refs.addForm.clearValidate();

this.$refs.loginForm.resetFields();//個(gè)人喜愛。clearValidate有時(shí)候驗(yàn)證清不掉，具體原因暫時(shí)沒找到

這樣所有使用了prop屬性的表單項(xiàng)都會(huì)被清空

注冊(cè)功能方法的代碼如下:

register(){

if(this.loginForm.password!==this.loginForm.confirm){

this.$message({

type:"error",

message:'2次密碼輸入不一致！'

return

this.$refs['loginForm'].validate((valid)={

if(valid){

request.post("/user/register",this.loginForm).then(res={

if(res.code===200){

this.$message({

type:"success",

message:"注冊(cè)成功"

//this.loginForm={

//name:'',

//username:'',

//password:'',

//confirm:'',

//department:'',

//phone:''

//}

this.$nextTick(()={

if(this.$refs.loginForm){

//this.$refs.addForm.clearValidate();

this.$refs.loginForm.resetFields();//個(gè)人喜愛。clearValidate有時(shí)候驗(yàn)證清不掉，具體原因暫時(shí)沒找到

this.dialogVisible=false//注冊(cè)成功后關(guān)閉注冊(cè)彈窗，記得使用this.方法，不然關(guān)閉不了

//this.resetForm(formName)

//this.$refs[this.loginForm].resetFields()

//this.$router.push("/modify")

}else{

this.$message({

type:"error",

message:res.message

補(bǔ)充：elementui清空表單數(shù)據(jù)

1、舉例組件代碼``

el-formref="searchForm":inline="true":model="form"label-width="80px"

!--prop屬性添加到form-item上,需要和綁定數(shù)據(jù)的最后名稱一致--

el-form-itemlabel="名稱:"prop="name"

el-inputv-model=""placeholder="請(qǐng)輸入內(nèi)容"/el-input

/el-form-item

el-form-item

el-buttontype="primary"@click="onSubmit"確定/el-button

el-button@click="resetForm('searchForm')"重置/el-button

/el-form-item

/el-form

2、表單加ref屬性：ref=searchForm

el-formref="searchForm":inline="true":model="form"label-width="80px"

3、form的每個(gè)item加prop屬性，否則無法清空,elementUI官方文檔中也有說明

el-form-itemlabel="名稱:"prop="name"

el-inputv-model=""placeholder="請(qǐng)輸入內(nèi)容"/el-input

/el-form-item

4、綁定點(diǎn)擊事件中傳入searchForm

el-form-item

el-button@click="resetForm('searchFo