若依系统的导航栏默认是在侧面的,如何改为在顶部呢?
这篇我们通过修改代码的方式来将导航栏放到顶部。
1、首先找到侧边栏组件页面
Sidebar下面的index页面,将mode改为horizontal
,然后添加一个样式,如下面代码所示。
<style lang="scss" scoped>
.menu{
display: flex;
}
</style>
此时页面是这种效果:
2、找到layout文件夹下的index页面
修改<sidebar>
标签下class的类名为任意的名字,就能变为顶部导航栏。
这个sidebar标签放置的位置不同导航栏的位置也会有差别,具体效果如下面两图所示。
放在位置一就是下面的效果
放在位置二就是下面的效果
3、找到assets->styles文件夹下的variables.scss文件
最后再将侧边栏的宽度改为0px即可。
4、最终效果:
这边只是提供一个大概的思路,其他的样式修改跟这个类似,比如将这个若依管理系统logo去掉或者放到左边 ,大家可以自己去摸索。