vuepress sidebar,
本文主要介绍VuePress侧边栏的具体使用，通过示例代码非常详细的介绍，对大家的学习或者工作有一定的参考价值。有需要的朋友下面和边肖一起学习。
目录
前言目录结构：极简侧边栏：侧边栏按组显示文件名(或其他指定名称)方法1方法2
前言
官网写的侧边栏教程真让人心疼。经过一番摸索，我终于大致想明白了。下面详细介绍一下使用方法：
目录结构：
docs根目录下有README.md，中文文件夹，英文文件夹。
最简侧边栏：
侧栏：{
/language/chinese/: [
，//此目录下的README.md文件
a ，//此目录中的a.md文件
此目录中的B //a.md文件
],
/language/english/: [
,
],
},
中文文件夹下的侧边栏：
英语文件夹下的侧栏：
如你所见，侧边栏效果已经出来了，不过还是来看看官网上的效果：
边栏上有群组。图片上的侧边栏分为两组。这是侧边栏分组。
侧边栏分组
我们把中文文件夹里的README.md分成Group1，a.md和b.md分成Group2:
侧栏：{
/language/chinese/: [
{
标题：“组1”，//组名
Children: []，//该分组下要显示的文件的目录
},
{
标题：“第二组”，
孩子：[a ， b]，
},
],
/language/english/: [
,
],
},
你可以看到分组是成功的，你可以发现每个md直接显示它的一级和二级标题。如果我们要显示这个md文件的文件名(或其他指定的名称)除了文件中的一级和二级标题之外，如下面的效果：
我该怎么办？官方给出了这个例子，用一个数组来指定路径和名称：
让我们试试：
侧栏：{
/language/chinese/: [
{
标题：“组1”，//组名
儿童：[
[ ，中文]
]
},
{
标题：“第二组”，
儿童：[
[a ， A]，
[b ， B]，
],
}
]
}
结果是：
可以看出，它只是改变了一级标题的名称，没有增加额外的名称。还有别的办法吗？肯定有办法的。
显示文件名（或其他指定名字）
方法1
最简单的方法是将一级标题的名称改为我们在md文件中指定的名称。这样做的缺点是一级标题在这个md文件中只能使用一次。(推荐这个方法。)
你可以看到另一个一级标题没有出现在侧边栏。
方法2
给这个文件加一个组，加一个组名，也就是一个md文件就是一个组，然后用大组把这些小组围起来。
小团体
我们向README.md添加一个名为chinese的分组：
{
标题：“中文”，
孩子：[]，
},
将名为a的组添加到a.md中
{
标题： A ，
孩子：[a]，
},
将名为b的组添加到b.md
{
标题： B ，
孩子：[b]，
},
大组：
假冒中国人组成一个大团体Group1:
{
标题：“第一组”，
儿童：[
{
标题：“中文”，
孩子：[]，
},
],
},
将a和b添加到大组Group2:
{
标题：“第二组”，
儿童：[
//团队a
{
标题： A ，
孩子：[a]，
},
//B组
{
标题： B ，
孩子：[b]，
},
],
},
完整代码：
侧栏：{
/language/chinese/: [
//Group1
{
标题：“第一组”，
儿童：[
{
标题：“中文”，//必要
孩子：[]
}
]
},
//组2
{
标题：“第二组”，
儿童：[
//团队a
{
标题： A ，
孩子：[a]，
},
//B组
{
标题： B ，
孩子：[b]，
},
],
},
],
},
显然这种写法很刺眼，所以推荐第一种方法。
关于VuePress侧边栏的具体使用，本文就到这里了。有关VuePress侧边栏的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。