vue爬坑之路(十)----element-ui

NavMenu導航菜單:

　　<el-menu

　　　　:default-active="$route.path" //當前激活菜單的 index
　　　　unique-opened:true   //是否只保持一個子菜單的展開
　　　　class="el-menu-vertical-demo"  
　　　　@open="handleOpen"   //事件展開指定的 sub-menu
　　　　@close="handleClose"　　//收起指定的 sub-menu
　　　　@select="handleSelect"　　//菜單激活回調
　　　　background-color="#fff"
　　　　text-color="#545c64"
　　　　active-text-color="rgb(98, 151, 218)" //當前激活菜單的文本顏色

　　>

　　　　<el-submenu index="1"> //index唯一標志
　　　　　　<template slot="title">　　//具名slot,分組名通過title屬性直接設定
　　　　　　　　<i class="el-icon-location"></i>
　　　　　　　　<span>賬號管理</span>
　　　　　　</template>
　　　　　　<el-menu-item-group> //分組
　　　　　　　　<el-menu-item index="/">
　　　　　　　　　　<router-link to="/" tag="span" class="span">C端用戶賬號管理</router-link>
　　　　　　　　</el-menu-item>
　　　　　　　　<el-menu-item index="/POSAccountManage">
　　　　　　　　　　<router-link to="/POSAccountManage" tag="span" class="span">門店商戶賬號</router-link>
　　　　　　　　</el-menu-item>
　　　　　　</el-menu-item-group>

　　　　</el-submenu>

　　　　<el-submenu index="1-1">
　　　　　　<template slot="title">商家店鋪商品</template>
　　　　　　<el-menu-item index="/merchantsShop">
　　　　　　　　<router-link to="/merchantsShop" tag="span" class="span">商家店鋪商品</router-link>
　　　　　　</el-menu-item>
　　　　</el-submenu>

　　</el-menu>