0


element ui form表单循环嵌套 及嵌套表单item的校验方法

html:

<div class="strategy-name-box">
              <div
                class="strategy-item"
                v-for="(item, index) in form.strategyList"
                :key="index"
              >
                <div class="strategy-title">{{ item.nodeName }}</div>
                <el-form-item
                  class="strategy-content"
                  v-for="(item1, index1) in item.inputPreConfig"
                  :label="'域名' + index"
                  :key="index1"
                  :prop="`strategyList[${index}].inputPreConfig[${index1}].value`"
                  :rules="{
                    required: true,
                    message: '域名不能为空',
                    trigger: 'blur',
                  }"
                >
                  <el-input v-model="item1.value" />
                </el-form-item>
              </div>
 </div>

js:

form: {
       
        taskTimeout: "",
        cycleInterval: "",
        cycleTime: "",
        strategyList: [
          {
            nodeName: "",
            inputPreConfig: [
              {
                name: "",
                value: "",
              },
            ],
          },
          {
            nodeName: "",
            inputPreConfig: [
              {
                name: "",
                value: "",
              },
            ],
          },
        ],
      },
submit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          alert(1111)
        } else {
          return false;
        }
      });
    },

详细的大家可以参考:element ui form循环嵌套表单 及嵌套表单的验证方法(校验)_element循环表单_RxnNing的博客-CSDN博客

标签: ui vue.js elementui

本文转载自: https://blog.csdn.net/zyg1515330502/article/details/131943943
版权归原作者 小贵子的博客 所有, 如有侵权,请联系我们删除。

“element ui form表单循环嵌套 及嵌套表单item的校验方法”的评论:

还没有评论