el-table树形表格表单验证(列表生成序号)

树形表格表单验证预览

因此，需要记录每一个row上面的属性路径，即实现记录每一行中属性（name，address）路径的方法。

 getPathByKey = (value, key, arr) => {
        let temppath = [];
        let realPath = ""
        try {
          function getNodePath(node) {
            temppath.push(node.currentIndex);
            //找到符合条件的节点，通过throw终止掉递归
            if (node[key] === value) {
              temppath.forEach((v, i) => {
                if (i == 0) {
                  realPath += "." + v
                } else {
                  realPath += `.children.${v}`
                }
              })
              // temppath = temppath.join(",")
              throw ("GOT IT!");
              // return;
            }
            if (node.children && node.children.length > 0) {
              for (var i = 0; i < node.children.length; i++) {
                getNodePath(node.children[i]);
              }

              //当前节点的子节点遍历完依旧没找到，则删除路径中的该节点
              temppath.pop();
            } else {

              //找到叶子节点时，删除路径当中的该叶子节点
              temppath.pop();
            }
          }

          for (let i = 0; i < arr.length; i++) {
            getNodePath(arr[i]);
          }
        } catch (e) {
          return realPath;
        }
      },

将每一列需要验证的item，路径查找好之后，form就可以具体监控到所有的表格输入，并触发正确的验证了，如图：

demo参考

到此这篇关于el-table树形表格表单验证(列表生成序号)的文章就介绍到这了,更多相关el-table树形表格表单验证内容请搜索来客网以前的文章或继续浏览下面的相关文章希望大家以后多多支持来客网！