element的navMenu的竖向模式,怎么设置菜单内部的内容布局样式,以及折叠展开的图标颜色?
根据element官网的navMenu教程,我根据自己的需要设置了NavMenu,以竖向模式,自定义颜色显示,我没有设置图标,但效果却是下面这样
这个图片的菜单内容,是从后台内得到的树形结构的数据,比较element官网演示的结果,我这个每个菜单的文字内容都居中了,而element官网演示的结果的那样是,菜单内部的文字是靠左。这是因为没有设置图标导致的吗?怎么改成菜单靠左呢?比如1级菜单靠左,二级菜单缩进一个汉字等之类的
生成菜单的html代码:
<el-menu class="el-menu-vertical-demo" background-color="#545c64"
text-color="#fff" active-text-color="#ffd04b">
<template v-for="(item ,index) in menu_list">
<el-submenu v-if="item.type=='1'" :index="item.sort">
<template slot="title">
<!-- <i class="el-icon-location"></i> -->
<span>{{item.title}}</span>
</template>
<template v-for="(item2 ,index2) in item.children">
<el-menu-item :index="item2.sort" @click="openPage(item2)"
v-if="item2.type=='2' || item2.type==undefined">
{{item2.title}}</el-menu-item>
</template>
</el-submenu>
<el-menu-item :index="item.sort" @click="openPage(item)"
v-else-if="item.type=='3' || item.type==undefined">{{item.title}}</el-menu-item>
</template>
</el-menu>
如何设置不同级别的菜单内部的内容靠边配置,或者直接改相关的样式?
还有每个菜单的折叠展开收缩图标,这个能修改的样式是哪个?我想改改图标颜色
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论