github:https://github.com/zdy1988/vue-jstree

示例:https://zdy1988.github.io/vue-jstree/

左侧是树形菜单

右侧是百度网盘的样式

基本用法 示例网站已经清楚了

关键解决 当我点击右侧文件夹  触发左侧的菜单切换和展开的问题

      // 右侧内容区域文件夹点击async folderClick(id) {// 设置选中 和 展开this.getMykey(this.treeData, id, 'opened', true);this.getMykey(this.treeData, id, 'selected', true);},/*** 遍历出当前应该选中的目录* @param obj 对象* @param id  点击的id* @param attr 修改的属性值* @param value 修改成value*/getMykey(obj, id, attr, value) {obj.forEach((e) => {if (e.id === id) {if (attr === 'selected' || attr === 'opened') {this.$set(e, attr, value);} else if (attr === 'children') {e.addChild(value);}} else if (e.children !== null && e.children.length > 0) {this.getMykey(e.children, id, attr, value);}});},

树形组件使用 vue-jstree 文档中心 百度网盘相关推荐

  1. vue - element <upload> 组件批量上传文档,可携带其他表单数据项一同与文件 “手动提交“ 服务器(类似百度文库系统批量上传前端界面与逻辑)超详细教程示例源码,提供界面与逻辑完整源码

    效果图 本示例使用的是 element 组件库,其实什么组件库都行(逻辑是一样),只要你是 vue.js 项目就能使用本教程. 本文实现了 vue + element 使用 upload 组件批量上传 ...

  2. 2w多字总结的VUE学习文档

    VUE学习文档 文章目录 VUE学习文档 回顾: 总结 0 目标 1.前言 2.认识Vue 3.快速入门 3.1.创建工程 3.2.安装vue 3.2.1.下载安装 3.2.2.使用CDN 3.3.v ...

  3. 微服务实践分享(9)文档中心

    1.文档中心 在项目中,需要协同开发,所以会写许多API文档给其他同事,以前都是写一个简单的TXT文本或Word文档,口口相传,这种方式比较老土了,所以,需要有个api管理系统专门来管理这些api 2 ...

  4. DevOps文档中心的技术实践演进

    这应该算是<Git企业开发者教程>的篇外篇,介绍一下这个教程是怎样写出来的.相信每个技术人都有类似下面的文件夹,保存着你辛苦工作的成果.实际的感觉:看着闹心,弃之不舍.一份文档久经修改,不 ...

  5. 项目视频讲解_深入浅出Lucene4.X实战开发大型企业文档中心管理系统

    深入浅出Lucene4.X实战开发大型企业文档中心管理系统 视频教程:http://pan.baidu.com/s/1CcuVM

  6. 部署springboot+vue项目文档(若依ruoyi项目部署步骤)

    部署springboot+vue项目文档(若依ruoyi项目部署步骤) 一:部署linux + nginx 二:部署windows + tomcat(无nginx) 三:解决调用第三方api如百度地图 ...

  7. 年度盘点丨产品在线帮助文档/中心怎么做?看完这4个案例就知道

    盘点之前先来聊下在线帮助文档/中心的作用 在线的帮助文档/中心就是将纸质版的产品操作说明迁移到互联网上的一种呈现方式.其作用是为了帮助用户加深产品认知,减少操作难度.如今线上营销火热的环境下,在线帮助 ...

  8. (十一)Alian 的 Spring Cloud 文档中心(swagger聚合文档)

    目录 一.简介 1.1.maven依赖 二.核心配置类 2.1.SwaggerUI配置 2.2.服务定义的上下文 2.3.定时刷下文档定义 2.4.文档接口 三.配置 3.1.主类 3.2.boots ...

  9. 先自己看文档和百度再沟通

    工作中遇到新的需求和技术,首先自己看文档和百度,能自己弄出来的不要去问别人. 自己无法理解,百度搜不到再去和别人沟通,不要总是问别人,自己独立解决问题.

最新文章

  1. vs配置编译c语言,为 VSCode 配置 C 语言编译环境
  2. Spring Cloud第十二篇:断路器监控(Hystrix Dashboard)
  3. oracle中聚合比较函数,Oracle聚合函数/分析函数
  4. 在图像旁边垂直对齐文字?
  5. 让asp.net程序在修改web.config后不重启
  6. numpy中的ndim、shape、dtype、astype
  7. centos7 redis5.0以后版本 集群部署示例
  8. C# 10 新特性 —— 补充篇
  9. 第六十六期:运维专家写给运维工程师的6条人生忠告
  10. C++标准库vector及迭代器
  11. Java NIO学习篇之缓冲区ByteBuffer详解
  12. Bailian2944 单词替换【字符串流】
  13. 力扣-897 递增顺序搜索树
  14. Python开发【第十九篇】:Python操作MySQL
  15. 【股价预测】基于matlab最小二乘法股票价格预测【含Matlab源码 348期】
  16. UINavigationBar颜色设置 用色码设置有误差
  17. php更换照片背景,ps怎么换照片背景
  18. 【强化学习】什么是强化学习算法?
  19. STM32在线烧录程序的开发
  20. pb函数库之字符串操作函数

热门文章

  1. 你还不知道ActiveReports?可与不同项目集成,拥有强大报表设计能力,满足各种报表开发需求
  2. qq服务器断掉修改昵称,qq昵称修改 更新资料失败
  3. CodeSmith 4 Release 注册破解序列号注册码方法
  4. linux cpu 使用10个进程,linux下获取占用CPU资源最多的10个进程
  5. 抖音回应全国上线外卖:仍在试点中;微软发布 ChatGPT 版搜索引擎;中国计算机图形学巨匠齐东旭教授逝世|极客头条
  6. 配置Mac 习惯使用环境
  7. FLEX中的组件隐藏显示是否占用位置的问题
  8. 羽毛球馆的两个基础设施你了解多少?
  9. 找工作,在51job和chinahr上投了很多简历,回复的太少了。帮忙看下我的简历
  10. The Closest M Points