vuepress 侧边栏(sidebar) 动态展示配置
vuepress sidebar 动态展示配置
vuepress 的侧边栏动态配置,研究了好几天终于弄懂了,它使用 JSON 的数组和对象两种方式配置侧边栏标题,对象针对每个导航变化时,侧边栏随着变动;数组则是针对每个页面内容变化,侧边栏跳转。vuepress 官网地址上使用就是。
配置侧边栏
如下图所示:
js
{
// ...
sidebar: {
'/dev_manage/': [{
title: 'items01',
collapsable: false,
children: [
{ title: 'items01', path: '/dev_manage/' },
{ title: 'items02', path: '/dev_manage/aaa' }
]
}],
'/literature/': [{
title: 'items02',
collapsable: false,
children: [
{ title: 'items01', path: '/literature/aaa' },
{ title: 'items02', path: '/literature/bbbb' }
]
}],
'/guide/': [{
title: 'items03-1',
collapsable: false,
children: [
{ title: 'items01', path: '/guide/' },
{ title: 'items01', path: '/guide/bbbb' }
]
},
{
title: 'items03-2',
collapsable: false,
children: [
{ title: 'items01', path: '/guide/aaaa/' },
{ title: 'items01', path: '/guide/bbb/' }
],
}],
'/language/': [{
title: 'items04',
collapsable: false,
children: [
{ title: 'Chinese', path: '/language/chinese/' },
{ title: 'English', path: '/language/english/' }
]
}]
}
}