👇
: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>