docusaurus导航栏下拉菜单

在docusaurus中想要在顶部导航栏实现下拉菜单

编辑 docusaurus.config.js

说明

{ label: 'go', to: '/docs/go' }, ， to 后边的 /docs/go ，其中 docs 是存放文档的总根目录，go 是在相对目录下新建的md文件中定义的文档id不是目录或文件名称

相对目录的解释：例如目录结构是这样的 docs/编程/go ，我现在想要在顶部做一个导航栏 编程 ，然后这个 编程 下有 go 和 python ，那此时就必须在 docs/编程/go 目录下新建一个md文件并写入以下内容，为了让显示置顶，一般用靠前的数字命令开头，例如 1.go.md，python操作相同

---
title: go
id: go
slug: /go
---

navbar: {
......
        // 这里的items是docs目录所有的文档总目录
        items: [
          {
            type: 'docSidebar',
            sidebarId: 'tutorialSidebar',
            position: 'left',
            label: '大烩菜',
          },
          {
            label: '编程', // 这里的label就是顶部导航栏显示的内容
            items: [
              { label: 'go', to: '/docs/go' },  // 这里的go不是文档目录，而是文件id，是在文档的相对根目录下新建的md文件中定义的
              { label: 'python', to: '/docs/python'},
            ]
          }, 
......
}

编辑 sidebars.js

说明

这里的 dirName 就是文档的实际目录

const sidebars = {
......
  // 编程
  go: [{ type: 'autogenerated', dirName: '编程/go'}],
  python: [{ type: 'autogenerated', dirName: '编程/python'}],
......
}

最终的效果就如下