树el-tree获取check选中的数据

效果树el-tree获取check选中的数据_第1张图片
首先通过el-col进行对页面的划分
通过给树绑定@check进行获取当前节点的数据
如果需要将所有的选中的节点放在一个数组,可以通过push

 //获取树选中的
      setCheckedNodes(node){
        this.checkAddData.push(node)
      },
<el-tree
            :props="props"
            :load="loadNode"
            lazy
            accordion
            check-strictly="false"
            @check-change = "setCheckedNodes"
            :default-expanded-keys= '[1]'
            :data="treeData"
            ref="tree"
            node-key="id"
            :filter-node-method="filterNode"
            highlight-current
            show-checkbox>
          </el-tree>

树el-tree获取check选中的数据_第2张图片
树el-tree获取check选中的数据_第3张图片
这里是树绑定的load事件,用来加载这个树的数据

loadNode(node, resolve) {
        this.checkExpend = [1]
        const parentId = (node.level === 0) ? 0 : node.data.id;
        getDeptLazyTree(parentId).then(res => {
          resolve(res.data.data.map(item => {
            return {
              ...item,
              leaf: !item.hasChildren
            }
          }))
        });
      },

你可能感兴趣的:(elementUi,vue)