文档树能否加个配置项,点击文档同时打开下一级,每次都需要点左边的小按钮很麻烦

本贴最后更新于 293 天前,其中的信息可能已经时移世改
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    28446 引用 • 119790 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • HugZephyr

    单击就展开的体验极其不好, 你可能想要的是双击展开

    // ### [js片段] 双击节点展开/折叠 (DOUBLE_SWITCH 控制)
    (() => {
      /***************************自主配置begin**************************************/
      // 修改配置后, 需要刷新页面(设置->快捷键->刷新), 否则会有问题
    
      const CONFIG = {
        DOUBLE_SWITCH  : true,  // 是否启用双击展开/折叠
        DOUBLE_INTERVAL: 300,   // 双击最大间隔时间 毫秒
      };
    
      /***************************自主配置end****************************************/
    
      // 生成唯一ID用于日志标识
      const SESSION_ID = Date.now();
    
      // 点击类型枚举
      const CLICK_TYPE = {
        INVALID: 0,  // 无效的点击
        NODE   : 1,  // 点击节点
        ARROW  : 2,  // 点击折叠按钮
        BOOK   : 3,  // 点击笔记本
      };
    
      // 工具函数
      const utils = {
        log(...args) {
          const now = new Date();
          const hours = String(now.getHours()).padStart(2, '0');     // 获取小时并补零
          const minutes = String(now.getMinutes()).padStart(2, '0');   // 获取分钟并补零
          const seconds = String(now.getSeconds()).padStart(2, '0');   // 获取秒数并补零
          const milliseconds = String(now.getMilliseconds()).padStart(3, '0'); // 获取毫秒并补零
          const timeString = `${hours}:${minutes}:${seconds}.${milliseconds}`; // 形成 hh:mm:ss.SSS 格式
          console.log(`[${SESSION_ID}] [${timeString}]:`, ...args);
      
        },
    
        getTagName(element) {
          return element?.tagName?.toLowerCase() || '';
        }
      };
    
      // 树节点处理类
      class TreeHandler {
        constructor() {
          this.lastClickTime = 0;   // 上次点击时间
        }
    
        // 获取当前元素对应的种类
        getClickType(element) {
          if (!element) return CLICK_TYPE.INVALID;
    
          let target = element;
          let tagName = utils.getTagName(target);
    
          // 处理SVG元素
          if (tagName === 'use') {
            target = element.parentElement.parentElement;
          } else if (tagName === 'svg') {
            target = element.parentElement;
          }
    
          tagName = utils.getTagName(target);
          if (tagName === 'ul') {
            return CLICK_TYPE.INVALID;
          }
          else if (tagName === 'li' && target.getAttribute('data-path') === '/') {
            return CLICK_TYPE.BOOK;
          }
          else if (tagName === 'li') {
            return CLICK_TYPE.NODE;
          }
          else if (tagName === 'span') {
            if (target.classList.contains('b3-list-item__toggle')) {
              return CLICK_TYPE.ARROW;
            }
            else if (target.classList.contains('b3-list-item__text') &&
              target.parentElement.getAttribute('data-path') === '/') {
              return CLICK_TYPE.BOOK;
            }
            else if (target.classList.contains('b3-list-item__text')) {
              return CLICK_TYPE.NODE;
            }
          }
          return CLICK_TYPE.INVALID;
        }
    
        // 点击节点对应的折叠按钮, 前提: element必须是点击的节点
        clickArrowButton(element) {
          const li = utils.getTagName(element) === 'span' ?
            element.parentElement : element;
          if (utils.getTagName(li) !== 'li') return;
    
          li.querySelector('span.b3-list-item__toggle:not(.fn__hidden)')?.click();
        }
    
    
        // 处理鼠标点击事件
        handleClickEvent(event) {
          const element = event.target;
          const clickType = this.getClickType(element);
    
          // 处理双击, 系统自带的双击监测事件, 有点问题, 所以自己实现一个
          const currentTime = Date.now();
          utils.log("点击了", (currentTime-this.lastClickTime), clickType, element);
          if (CONFIG.DOUBLE_SWITCH && currentTime - this.lastClickTime < CONFIG.DOUBLE_INTERVAL &&
            clickType === CLICK_TYPE.NODE) {
            utils.log("双击展开/折叠触发");
            this.clickArrowButton(element);
          }
          this.lastClickTime = currentTime;
        }
      }
    
      // 初始化并监听点击事件
      let initInterval = setInterval(() => {
        const treeContainer = document.querySelector('.sy__file>.fn__flex-1');
        if (treeContainer) {
          clearInterval(initInterval);
          const handler = new TreeHandler();
          treeContainer.addEventListener('click',
            e => handler.handleClickEvent(e), true);
        }
      }, 200);
    
    })();
    
    
    1 回复
  • auric 3 评论

    集市有个插件:双击文档树,应该是差不多的。

    我知道那个, 但是他好像有 bug(小声), 我就自己写了一个
    HugZephyr
    我以前用这个插件发现会有卡死整个界面的问题
    JeffreyChen
    哈哈,我倒没有遇到过,平时用文档树的时间比较少
    auric
  • 可以用多层笔记本插件的自动模式

  • sisisi 1 评论

    的确单击就展开是存在体验不好的时候,我觉得更好的方式是和 Trilium 一样,将子文档的预览放在当前文档的底部,图示中选中社会科学类后就能浏览该文档下的子文档大概情况,同时可以直接进入 2 级子文档,如这里的认知科学。而不需要展开社会科学类-> 展开心理学-> 点击认知科学。

    image.png

推荐标签 标签

  • Openfire

    Openfire 是开源的、基于可拓展通讯和表示协议 (XMPP)、采用 Java 编程语言开发的实时协作服务器。Openfire 的效率很高,单台服务器可支持上万并发用户。

    6 引用 • 7 回帖 • 133 关注
  • CodeMirror
    2 引用 • 17 回帖 • 197 关注
  • CongSec

    本标签主要用于分享网络空间安全专业的学习笔记

    1 引用 • 1 回帖 • 55 关注
  • 快应用

    快应用 是基于手机硬件平台的新型应用形态;标准是由主流手机厂商组成的快应用联盟联合制定;快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台;以平台化的生态模式对个人开发者和企业开发者全品类开放。

    15 引用 • 127 回帖
  • SMTP

    SMTP(Simple Mail Transfer Protocol)即简单邮件传输协议,它是一组用于由源地址到目的地址传送邮件的规则,由它来控制信件的中转方式。SMTP 协议属于 TCP/IP 协议簇,它帮助每台计算机在发送或中转信件时找到下一个目的地。

    4 引用 • 18 回帖 • 662 关注
  • Folo

    Folo 是一个 RSS 阅读和信息聚合应用,整合多种内容源到统一时间线。

    项目地址:https://github.com/RSSNext/Folo

    1 引用 • 3 回帖 • 2 关注
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 650 关注
  • 千千插件

    千千块(自定义块 css 和 js)
    可以用 ai 提示词来无限创作思源笔记

    32 引用 • 69 回帖
  • Gitea

    Gitea 是一个开源社区驱动的轻量级代码托管解决方案,后端采用 Go 编写,采用 MIT 许可证。

    5 引用 • 16 回帖 • 3 关注
  • 代码片段

    代码片段分为 CSS 与 JS 两种代码,添加在 [设置 - 外观 - 代码片段] 中,这些代码会在思源笔记加载时自动执行,用于改善笔记的样式或功能。

    用户在该标签下分享代码片段时需在帖子标题前添加 [css] [js] 用于区分代码片段类型。

    285 引用 • 1988 回帖
  • webpack

    webpack 是一个用于前端开发的模块加载器和打包工具,它能把各种资源,例如 JS、CSS(less/sass)、图片等都作为模块来使用和处理。

    43 引用 • 130 回帖 • 259 关注
  • WebComponents

    Web Components 是 W3C 定义的标准,它给了前端开发者扩展浏览器标签的能力,可以方便地定制可复用组件,更好的进行模块化开发,解放了前端开发者的生产力。

    1 引用 • 17 关注
  • Mac

    Mac 是苹果公司自 1984 年起以“Macintosh”开始开发的个人消费型计算机,如:iMac、Mac mini、Macbook Air、Macbook Pro、Macbook、Mac Pro 等计算机。

    168 引用 • 598 回帖
  • 30Seconds

    📙 前端知识精选集,包含 HTML、CSS、JavaScript、React、Node、安全等方面,每天仅需 30 秒。

    • 精选常见面试题,帮助您准备下一次面试
    • 精选常见交互,帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段,帮助你获取最佳实践
    • 精选常见代码集,帮助您提高打码效率
    • 整理前端界的最新资讯,邀您一同探索新世界
    488 引用 • 384 回帖
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 193 关注
  • GitHub

    GitHub 于 2008 年上线,目前,除了 Git 代码仓库托管及基本的 Web 管理界面以外,还提供了订阅、讨论组、文本渲染、在线文件编辑器、协作图谱(报表)、代码片段分享(Gist)等功能。正因为这些功能所提供的便利,又经过长期的积累,GitHub 的用户活跃度很高,在开源世界里享有深远的声望,并形成了社交化编程文化(Social Coding)。

    213 引用 • 2044 回帖
  • Webswing

    Webswing 是一个能将任何 Swing 应用通过纯 HTML5 运行在浏览器中的 Web 服务器,详细介绍请看 将 Java Swing 应用变成 Web 应用

    1 引用 • 15 回帖 • 669 关注
  • Sillot

    Insights(注意当前设置 master 为默认分支)

    汐洛彖夲肜矩阵(Sillot T☳Converbenk Matrix),致力于服务智慧新彖乄,具有彖乄驱动、极致优雅、开发者友好的特点。其中汐洛绞架(Sillot-Gibbet)基于自思源笔记(siyuan-note),前身是思源笔记汐洛版(更早是思源笔记汐洛分支),是智慧新录乄终端(多端融合,移动端优先)。

    主仓库地址:Hi-Windom/Sillot

    文档地址:sillot.db.sc.cn

    注意事项:

    1. ⚠️ 汐洛仍在早期开发阶段,尚不稳定
    2. ⚠️ 汐洛并非面向普通用户设计,使用前请了解风险
    3. ⚠️ 汐洛绞架基于思源笔记,开发者尽最大努力与思源笔记保持兼容,但无法实现 100% 兼容
    29 引用 • 25 回帖 • 152 关注
  • 学习

    “梦想从学习开始,事业从实践起步” —— 习近平

    176 引用 • 544 回帖
  • RIP

    愿逝者安息!

    8 引用 • 92 回帖 • 429 关注
  • 资讯

    资讯是用户因为及时地获得它并利用它而能够在相对短的时间内给自己带来价值的信息,资讯有时效性和地域性。

    56 引用 • 85 回帖 • 1 关注
  • HHKB

    HHKB 是富士通的 Happy Hacking 系列电容键盘。电容键盘即无接点静电电容式键盘(Capacitive Keyboard)。

    5 引用 • 74 回帖 • 548 关注
  • 友情链接

    确认过眼神后的灵魂连接,站在链在!

    25 引用 • 373 回帖 • 4 关注
  • API

    应用程序编程接口(Application Programming Interface)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

    79 引用 • 431 回帖
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 443 关注
  • DNSPod

    DNSPod 建立于 2006 年 3 月份,是一款免费智能 DNS 产品。 DNSPod 可以为同时有电信、网通、教育网服务器的网站提供智能的解析,让电信用户访问电信的服务器,网通的用户访问网通的服务器,教育网的用户访问教育网的服务器,达到互联互通的效果。

    6 引用 • 26 回帖 • 548 关注
  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    28446 引用 • 119790 回帖