959 Star 5.1K Fork 1.6K

GVPsmallwei / Avue

 / 详情

表单包含多个子表单提交时校验异常

已完成
创建于  
2021-02-04 12:10

大佬,我在实际使用过程中涉及到单表单多个子表单的需求,遇到的问题如下:
1、2.7.4版本
1.1 第一个表单校验正常
输入图片说明
1.2 第二个表单校验异常,如下图右下角错误提示
输入图片说明
2、2.7.9版本
2.0 同时也出现子表单校验的*号与输入框换行的,如2.1图
2.1 第一个表单校验异常
输入图片说明
2.2 第二个表单校验异常
输入图片说明

复现DEMO如下:

<template>
  <basicContainer>
    <avue-form :option="option1" v-model="obj" @submit="add">
    </avue-form>
  </basicContainer>
</template>
<script>
  export default {
    data() {
      return {
        obj: {
          dynamic: [],
          dynamic1: []
        },
        option1: {
          column: [{
              label: '子表单',
              prop: 'dynamic',
              type: 'dynamic',
              span: 24,
              rules: [{
                required: true,
                message: '请选择选择框1',
              }],
              children: {
                align: 'center',
                headerAlign: 'center',
                rowAdd: (done) => {
                  this.$message.success('新增回调');
                  done({
                    input: '默认值'
                  });
                },
                rowDel: (row, done) => {
                  this.$message.success('删除回调' + JSON.stringify(row));
                  done();
                },
                column: [{
                  width: 200,
                  label: '输入框',
                  prop: "input",
                  rules: [{
                    required: true,
                    message: '请选择选择框2',
                  }],
                }]
              }
            },
            {
              label: '子表单',
              prop: 'dynamic1',
              type: 'dynamic',
              span: 24,rules: [{
                    required: true,
                    message: '请选择选择框',
                  }],
              children: {
                align: 'center',
                headerAlign: 'center',
                rowAdd: (done) => {
                  this.$message.success('新增回调');
                  done({
                    input: '默认值'
                  });
                },
                rowDel: (row, done) => {
                  this.$message.success('删除回调' + JSON.stringify(row));
                  done();
                },
                column: [{
                  width: 200,
                  label: '输入框',
                  prop: "input",
                  rules: [{
                    required: true,
                    message: '请选择选择框3',
                  }],
                }]
              }
            }
          ]
        }
      }
    },
    methods: {
      add(obj, done) {
        console.log(obj);
        done();
      }
    }
  }
</script>

评论 (0)

yutons 创建了任务
yutons 关联仓库设置为smallwei/Avue
yutons 修改了描述
smallwei 任务状态待办的 修改为进行中
smallwei 里程碑设置为v2.7.10
smallwei 任务状态进行中 修改为已完成
展开全部操作日志

登录 后才可以发表评论

状态
负责人
里程碑
Pull Requests
关联的 Pull Requests 被合并后可能会关闭此 issue
分支
开始日期   -   截止日期
-
置顶选项
优先级
参与者(1)
JavaScript
1
https://gitee.com/smallweigit/avue.git
git@gitee.com:smallweigit/avue.git
smallweigit
avue
Avue

搜索帮助