vue + element +el-tree 记录当前操作展开后的节点

需求:当点击人员部门展开选择人员并编辑人员信息后,理论上编辑成功发送后端并重新渲染树状结构数据,页面的竖状结构如果不是默认全部展开的状态下,是需要重新再次点开才能看到刚刚的编辑操作的,这里我们就需要记录下el-tree 节点操作了。

记录只需要两部即可,第一需要知道绑定展开的节点::default-expanded-keys 第二 每次展开触发事件:node-expand

这两个el-tree都是支持的,只要记录下不管数据怎么重新刷新都还是会找到当前的节点并展开的。

代码:

 <el-tree
            :data="ajaxdata"
            node-key="id"
            :default-expanded-keys="defaultkeyarr"
             @node-expand="fnnodepand"
            :expand-on-click-node="true"
            :render-content="renderContent">
          </el-tree>

defaultkeyarr:[], // 默认展开的数组

 methods:{
          fnnodepand(node){
            this.defaultkeyarr.push(node.id)

          },}

 

posted @ 2022-04-14 14:08  少哨兵  阅读(1240)  评论(0编辑  收藏  举报