结构:
<div v-for="(itemBox, idx) in dataFormList" :key="itemBox.id">
<!-- 基础信息 -->
<BasicInfo ref="basicInfo" :car-id="itemBox.carId" :type="type" />
<div class="t-group">
<div style="display: flex;align-items: center;">
<div style="width: 22px; height: 22px;" />
<div class="font-color-dark" style="margin-left: 20px;font-size: 18px;margin-top:10px">
发票信息
</div>
</div>
<!-- -->
<div style="margin-top:40px">
<el-form ref="form" :model="itemBox" :inline="true" :rules="rules" size="small" label-width="240px">
<el-row class="contract-row">
<el-col :span="10">
<el-form-item label="发票类型:" prop="ticketType">
<el-select
v-model="itemBox.ticketType"
:disabled="itemBox.ticketCheck ? true : false"
clearable
placeholder="请选择"
@change="selectTicketType"
>
<el-option
v-for="item in invoiceTypeOption"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="发票代码:" prop="ticketCode">
<el-input
v-model="itemBox.ticketCode"
:disabled="itemBox.ticketCheck ? true : false"
clearable
placeholder="请输入"
maxlength="50"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
</div>
<!-- 底部 -->
<div class="footer">
<el-button @click="goBack">
返回
</el-button>
<el-button type="primary" @click="handleSave">保存 </el-button>
</div>
方法:
async handleSave() {
const arr = []
this.dataFormList.forEach((v, index) => {
arr.push(this.$refs[`form`][index].validate())
})
const valids = await Promise.all(arr)
if (valids.filter(el => !el).length == 0) {
//做一些事情
}
}