feat: support display header links of all pages (close #534) (#595)

Author: Zhu Kaihao

docs/default-theme-config/README.md

@@ -142,6 +142,18 @@ sidebarDepth: 2
 ---
 ```
 
+### Displaying Header Links of All Pages
+
+The sidebar only displays links for headers in the current active page. You can display all header links for every page with `themeConfig.displayAllHeaders: false`:
+
+``` js
+module.exports = {
+  themeConfig: {
+    displayAllHeaders: true // Default: false
+  }
+}
+```
+
 ### Active Header Links
 
 By default, the nested header links and the hash in the URL are updated as the user scrolls to view the different sections of the page. This behavior can be disabled with the following theme config:

docs/zh/default-theme-config/README.md

@@ -130,7 +130,7 @@ module.exports = {
 
 ### 嵌套的标题链接
 
-默认情况下，侧边栏会自动地显示由当前页面标的题（headers）组成的的链接，并按照页面本身的结构进行嵌套，你可以通过 `themeConfig.sidebarDepth` 来修改它的行为。默认的深度是 `1`，它将提取到 `h2` 的标题，设置成 `0` 将会禁用标题（headers）链接，同时，最大的深度为 `2`，它将同时提取 `h2` 和 `h3` 标题。
+默认情况下，侧边栏会自动地显示由当前页面的标题（headers）组成的链接，并按照页面本身的结构进行嵌套，你可以通过 `themeConfig.sidebarDepth` 来修改它的行为。默认的深度是 `1`，它将提取到 `h2` 的标题，设置成 `0` 将会禁用标题（headers）链接，同时，最大的深度为 `2`，它将同时提取 `h2` 和 `h3` 标题。
 
 也可以使用 `YAML front matter` 来为某个页面重写此值：
 
@@ -140,6 +140,18 @@ sidebarDepth: 2
 ---
 ```
 
+### 显示所有页面的标题链接
+
+默认情况下，侧边栏只会显示由当前活动页面的标题（headers）组成的链接，你可以设置 `themeConfig.displayAllHeaders` 来显示所有页面的标题链接：
+
+``` js
+module.exports = {
+  themeConfig: {
+    displayAllHeaders: true // 默认值：false
+  }
+}
+```
+
 ### 活动的标题链接
 
 默认情况下，当用户通过滚动查看页面的不同部分时，嵌套的标题链接和 URL 中的 Hash 值会实时更新，这个行为可以通过以下的配置来禁用：

lib/default-theme/SidebarLink.vue

@@ -18,9 +18,10 @@ export default {
       ? $page.frontmatter.sidebarDepth
       : $site.themeConfig.sidebarDepth
     const maxDepth = configDepth == null ? 1 : configDepth
+    const displayAllHeaders = !!$site.themeConfig.displayAllHeaders
     if (item.type === 'auto') {
       return [link, renderChildren(h, item.children, item.basePath, $route, maxDepth)]
-    } else if (active && item.headers && !hashRE.test(item.path)) {
+    } else if ((active || displayAllHeaders) && item.headers && !hashRE.test(item.path)) {
       const children = groupHeaders(item.headers)
       return [link, renderChildren(h, children, item.path, $route, maxDepth)]
     } else {
@@ -48,7 +49,7 @@ function renderChildren (h, children, path, route, maxDepth, depth = 1) {
   return h('ul', { class: 'sidebar-sub-headers' }, children.map(c => {
     const active = isActive(route, path + '#' + c.slug)
     return h('li', { class: 'sidebar-sub-header' }, [
-      renderLink(h, '#' + c.slug, c.title, active),
+      renderLink(h, path + '#' + c.slug, c.title, active),
       renderChildren(h, c.children, path, route, maxDepth, depth + 1)
     ])
   }))