vue Element UI树的手动点击选中（非checkbox选中）

最新推荐文章于 2023-10-11 12:30:12 发布

Zack_ZXY

最新推荐文章于 2023-10-11 12:30:12 发布

阅读量4.9k

点赞数 1

分类专栏：前端学习笔记文章标签： vue element

本文链接：https://blog.csdn.net/u013253924/article/details/85339725

版权

前端学习笔记专栏收录该内容

45 篇文章 1 订阅

订阅专栏

element数形组件提供手动checkbox选中

有时候我们希望，手动设置树上的选中样式，类似于这种：

直接上源码：

// 手动点击选中树节点（非checkbox选中）
export function manualClickChecked(theTree, manualNode, alwaysExpand) {
  var store = theTree.store
  store.setCurrentNode(manualNode)
  theTree.$emit('current-change', store.currentNode ? store.currentNode.data : null, store.currentNode)
  if (alwaysExpand) {
    if (theTree.currentNode.expanded) {
      // do nothing
    } else {
      theTree.currentNode.handleExpandIconClick()
    }
  } else {
    if (theTree.expandOnClickNode) {
      theTree.currentNode.handleExpandIconClick()
    }
  }
  theTree.$emit('node-click', manualNode.data, manualNode, theTree)
}

第一个参数是树组件，第二个参数是手动选中的node节点，第三个是否展开

这个方法触发树的node-click方法，回调的参数为手动选中的node节点data、手动选中的节点node，树组件

最后要记得加上highlight属性