[element-ui] el-form rule v-for 动态校验

动态获取form表单内容,包括是否必填,双向绑定

 <el-form-item
     v-for="item in dynamicFormList"
     :key="item.rpid + 'rsid'"
     :label="item.rpname + ':'"
     :prop="item.rpisrequired ? 'objList.' + item.rpid : false"
   >
       <el-input
         v-model="ruleForm.objList[item.rpid]"
         class="formWidthdpls"
         :placeholder="'请输入' + item.rpname"
       ></el-input>
 </el-form-item>
        

 ruleForm: {
     title: "",
     objList: {},
     // tag: "",
   },
 dynamicFormList:[]

 接口.then((res) => {
   console.log(res);
   this.dynamicFormList = res.data;
   this.dynamicFormList.forEach((item) => {
     item.rpid = "name" + item.rpid;
     let form = {
       required: true,
       message: "请输入" + item.rpname,
       trigger: "blur",
     };
     this.rules.objList[item.rpid] = [];
     this.rules.objList[item.rpid].push(form);
     // this.ruleForm.objList[item.rpid]=''
     this.$set(this.ruleForm.objList, item.rpid, "");
   });


element+vue2循环渲染v-model及附带rule规则遍历

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值