docsify-sidebar-collapse
docsify-sidebar-collapse copied to clipboard
使用 sidebar-folder.css 时,目录(folder)被添加文件(file)样式
问题:当目录为空时,addFolderFileClass
函数中的 li.querySelector('ul:not(.app-sub-sidebar)')
在判断时,由于后续找不到 ul
节点,所以会添加 file 属性。
解决方案:在 li.querySelector('ul:not(.app-sub-sidebar)')
的判断处添加一种新的判断。可以是 li.querySelector('a').href.endsWith('/')
。
原理: docsify 在解析 “markdown” 文件时,若以 “.md” 结尾则 a 标签
中的 “href” 的值不会以 “/” 结尾,而如果是目录则会添加斜杠(“/”)。
是否引起其他问题:暂未发现。
修改后的代码如下:
function addFolderFileClass() {
document.querySelectorAll('.sidebar-nav li').forEach(function (li) {
if (li.querySelector('ul:not(.app-sub-sidebar)') || li.querySelector('a').href.endsWith('/')) {
li.classList.add('folder');
} else {
li.classList.add('file');
}
});
}
拓展:
问题:sidebar 在解析 markdown 文件时,会多出来一个层级(与文档的一级标题一致)
解决方案:若需要移除它,需要找到 docsify.js
文件,在 Compiler.prototype.subSidebar = function subSidebar (level)
函数中 找到 toc[0] && toc[0].level === 1 && toc.shift();
然后复制一行并保存。
是否引起其他问题:在未设置 alias
聚合侧边栏时,会丢失第一个层级(文档的一级标题),其他正常显示。
谢谢@YaKazama的分析,我也遇到同样问题了。按照你的方法patch完了还是不对 https://codesandbox.io/s/musing-star-j4g9t2?file=/sidebar-collapse-patched.js