v-for循环生成el-input带rules验证 发布时间:2025/01/17 功能介绍:利用v-for循环批量生成el-input组件,并对指定el-input带rules验证。 1、template <el-form :model="searchForm" :rules="rules" ref="ruleForm" label-width="100px" > <div v-for="(item, index) in searchForm.list" :key="index"> <el-form-item :label="item.label" :prop="'list.' + index + '.value'" :rules="item.rules.value" > <el-input v-model="item.value" :placeholder="item.placeHolder" ></el-input> </el-form-item> </div> </el-form> 复制代码 2、data data() { return { searchForm: { list: [ { index: 1, value: "", label: "名称:", placeHolder: "请输入", rules: { value: [ { required: true, message: "请输入名称", trigger: "blur" } ] } }, { index: 2, value: "", label: "年龄:", placeHolder: "请输入", rules: { value: [{ required: false }] } }, { index: 1, value: "", label: "身份证号:", placeHolder: "请输入", rules: { value: [ { required: true, message: "请输入身份证号", trigger: "blur" } ] } } ] }, rules: {} } } 复制代码 以上是编程学习网小编为您介绍的“v-for循环生成el-input带rules验证”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。