el-tree 树取消高亮

html 复制代码
 <el-tree
          accordion
          ref="treeRef"
          :data="treedata"
          class="treeRef"
          :current-node-key="currentnode"
          :props="defaultProps"
          highlight-current
          node-key="id"
          :default-expanded-keys="[3, 31, 311]"
          @node-click="handleNodeClick"
        >
          <template #default="{ node }">
            <img
              style="margin-right: 5px"
              :src="treeimgComputed(node.data)"
              alt=""
            />
            <p>{{ node.label }}</p>
          </template>
        </el-tree>
javascript 复制代码
const currentnode: any = ref(null);
const treeRef = ref();
const defaultProps = {
  children: "children",
  label: "label",
};
watch(currentnode, (val) => {
  treeRef.value.setCurrentKey(val);
});
const handleNodeClick = (data: any) => {
  // console.log("打印树:", data);
  currentnode.value = data.id;
  
};

主要代码就是取消高亮把currentnode赋值为null;和监听ref数据

javascript 复制代码
currentnode.value = null;

watch(currentnode, (val) => {
  treeRef.value.setCurrentKey(val);
});

const handleNodeClick = (data: any) => {
  // console.log("打印树:", data);
  currentnode.value = data.id;
   
};
相关推荐
天天向上10243 分钟前
vue让elementUI和elementPlus标签内属性支持rem单位
javascript·vue.js·elementui
罗会23 分钟前
TailWindCss安装使用教程
前端
小宁爱Python29 分钟前
Vue入门:vue项目的创建和基本概念
前端·javascript·vue.js
二闹31 分钟前
前端研发岗位PWA相关面试题总结和解析
前端·面试
活着也很快乐1 小时前
Element-plus 离线文档部署
前端
徐知行1 小时前
前后端对时最佳实现
javascript
子林super1 小时前
公司日志中心ELK使用指南
前端
白雾茫茫丶1 小时前
Nuxt4.0初体验:一个简约、精美、现代化的个人站点导航!
vue.js·nuxt.js
ZzMemory1 小时前
少写重复代码的精髓:JS方法借用
前端·javascript·面试
walking9571 小时前
CSS变量(自定义属性)命名规范
前端