👇
:prop="'devInfos.'+index+'.ip'" // 官方写法
:rules="[{ required: true, message: '请输入设备mac'}]" // 行内写规则
data () {
return {
ruleForm: {
roomName: '',
maxPeopleNum: '',
isEnable: false,
devInfos: [
{
id: '',
ip: '',
mac: '',
account: '',
password: ''
}
]
},
}
}
这样就好啦
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="会议室名称" prop="roomName">
<el-input v-model="ruleForm.roomName" placeholder="请输入会议名称"></el-input>
</el-form-item>
<el-form-item label="可容纳人数" prop="maxPeopleNum">
<el-input v-model.number="ruleForm.maxPeopleNum" type="number" placeholder="请输入可容纳人数"></el-input>
</el-form-item>
<el-form-item label="停用/启用" prop="isEnable">
<el-switch v-model="ruleForm.isEnable"></el-switch>
</el-form-item>
<div v-for="(item, index) in ruleForm.devInfos" :key="index" >
<el-form-item class="devInfos" label="设备IP" :prop="'devInfos.'+index+'.ip'" :rules="[{ required: true, message: '请输入设备IP'}]">
<el-input v-model="item.ip" placeholder="请输入设备IP"></el-input>
</el-form-item>
<el-form-item label="设备mac" :prop="'devInfos.'+index+'.mac'" :rules="[{ required: true, message: '请输入设备mac'}]">
<el-input v-model="item.mac" placeholder="请输入设备mac"></el-input>
</el-form-item>
<el-form-item label="设备账号" :prop="'devInfos.'+index+'.account'" :rules="[{ required: true, message: '请输入设备账号'}]">
<el-input v-model="item.account" placeholder="请输入设备账号"></el-input>
</el-form-item>
<el-form-item label="设备密码" :prop="'devInfos.'+index+'.password'" :rules="[{ required: true, message: '请输入设备密码'}]">
<el-input v-model="item.password" placeholder="请输入设备密码"></el-input>
</el-form-item>
<el-form-item label="">
<el-button type="text" @click="addDevInfo">新增</el-button>
<el-button v-show="ruleForm.devInfos.length>1" type="text" @click="delDevInfo(index)">删除</el-button>
</el-form-item>
</div>
<el-form-item class="btn">
<el-button class="cancelBtn" @click="handleClose('ruleForm')">取消</el-button>
<el-button :loading="btnLoading" class="publishBtn" @click="save('ruleForm')">保存</el-button>
</el-form-item>
</el-form>