activemenu怎么拼 vue_vue侧边栏动态生成下级菜单的方法

微商城管理后台

class="el-menu-headBar"

mode="horizontal"

@select="handleSelect"

background-color="#000000"

text-color="#fff"

active-text-color="#ffd04b"

:unique-opened="true"

:default-active="onRoutes" router>

{{item.title}}

{{ subItem.title }}

{{ item.title }}

export default {

data() {

return {

activeIndex: "1",

items: [

{

icon: 'el-icon-menu',

index: '1',

title: '数据统计',

subs: [

{

index: '/monitor',

title: '客流展示'

},

{

index: '/monitor/device',

title: '设备采集'

},

{

index: '/monitor/tv',

title: '监控视频'

}

]

},{

icon: 'el-icon-goods',

index: '/product',

title: '商品管理',

},{

icon: 'el-icon-goods',

index: '/category',

title: '类目管理',

},{

icon: 'fa fa-cart-arrow-down',

index: '/order',

title: '订单一览'

},{

icon: 'fa fa-user-o',

index: '/merchant',

title: '商家信息'

},{

icon: 'el-icon-printer',

index: '9',

title: '微商城',

subs:[

{

icon: 'el-icon-printer',

index: '/banner',

title: 'banner设置'

},{

icon: 'el-icon-printer',

index: '/decoration',

title: '首页装修'

},{

icon: 'el-icon-printer',

index: '/message',

title: '消息设置'

}

]

},{

icon: 'el-icon-printer',

index: '10',

title: '线下店',

subs:[

{

icon: 'el-icon-printer',

index: '/device',

title: '设备管理'

},{

icon: 'el-icon-printer',

index: '/advertise',

title: '广告管理'

},{

icon: 'el-icon-printer',

index: '/version',

title: '版本管理'

}

]

},{

icon: 'el-icon-printer',

index: '/largeUI',

title: '大屏'

},{

icon: 'el-icon-printer',

index: '/coupon',

title: '优惠券'

}

],

}

},

methods: {

handleSelect(key, keyPath) {

console.log(key, keyPath);

}

},

computed:{

onRoutes(){

return this.$route.path.replace('/','');

}

}

}

.el-menu-headBar {

width: 80%;

min-width: 950px;

font-size: 12px;

border-bottom: 1px #000000;

}

.headBar {

width: 100%;

height: 50px;

display: flex;

background-color: #000000;

}

.title {

background-color: #ffdb15;

color: #000;

height: 100%;

min-width: 200px;

width: 200px;

display: flex;

justify-content: center;

align-items: center;

letter-spacing: 5px;

font-size: 17px;

}