首页 > 其他 > 详细

elementui tree控件 设置默认选中并高亮第一行

时间:2021-06-24 15:31:09      阅读:358      评论:0      收藏:0      [点我收藏+]

技术分享图片

 

 

 

技术分享图片

 

 

 注意:一定要写上this.$nextTick   否则不生效

      <el-tree
              ref="treeRef"
              :highlight-current="true"
              default-expand-all
              :data="architectureData"
              node-key="id"
              :current-node-key="currentNodekey"
              :props="defaultProps"
              @node-click="handleNodeClick"
            ></el-tree>



currentNodekey: "", //默认选中的节点树 async treeByDept() { await treeByDept({}).then((res) => { this.architectureData = res.data; if (this.architectureData.length > 0) { this.currentNodekey = this.architectureData[0].id; this.$nextTick(() => { this.$refs.treeRef.setCurrentKey(this.currentNodekey); //一定要加这个选中了否则样式没有出来 }); } }); },



/* 点击树结构项的选中颜色 */
.el-tree--highlight-current .is-current.el-tree-node > .el-tree-node__content {
  background-color: #99ccff !important;
}

elementui tree控件 设置默认选中并高亮第一行

原文:https://www.cnblogs.com/web-aqin/p/14926651.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!