//data里面以及請求接口保存數(shù)據(jù)的時(shí)候需要用下列的方式去寫（如果接口原先沒有fieldValue這個(gè)字段，需要循環(huán)遍歷，給他先賦值為空字符串吴菠，如果有這個(gè)字段的話，直接賦值就行浩村。做葵。。）
const list = res.rows
list.forEach(item => {
item.fieldValue = ''
})
this.queryParams4.apOrderFieldList = list
//data里面定義的
queryParams4: {
apOrderFieldList: []
},
這兩個(gè)字段與下面的代碼要對(duì)應(yīng)Ｐ氖Ｄ鹗浮！怎燥！
<el-form v-if="queryParams4.apOrderFieldList.length>0" ref="queryParams4" :model="queryParams4" :inline="true"
label-width="80px">
<el-row v-for="(item, index) in queryParams4.apOrderFieldList" :key="index">
<el-col :span="24">
<el-form-item :label="item.chineseName" :prop="'apOrderFieldList.'+index+'.fieldValue'" :rules="[
{
required: item.defaultFlag == '1' ? true : false,
message: item.chineseName + '不能為空',
trigger: 'blur',
},
{
min: item.minLength,
max: item.maxLength,
message:
'長度在' +
item.minLength +
'到' +
item.maxLength +
'個(gè)字符',
trigger: 'blur',
}
]">
<el-input v-model="item.fieldValue" :placeholder="'請輸入'+item.chineseName" clearable size="small"
style="width: 430px" type="text"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
image.png
借用網(wǎng)友的一張圖瘫筐，也就是畫橫線的幾個(gè)地方必須要對(duì)應(yīng)，否則會(huì)報(bào)下列的錯(cuò)誤铐姚。
image.png
在切換tab的時(shí)候需要給表單校驗(yàn)清除掉策肝，但是表單校驗(yàn)的清除必須在表單賦上值之后才可以清除，負(fù)責(zé)會(huì)報(bào)表單校驗(yàn)清除的方法為undefind
//這個(gè)表單要賦上值才可以
this.queryParams4.apOrderFieldList = list
// 有值的時(shí)候再去給他清楚
this.$nextTick(() => {
this.$refs.queryParams4 && this.$refs.queryParams4.clearValidate()
})
