vue-router路由與elementUI配合寫導航欄跳轉

之前沒寫過vue，也是第一次用element ，然后就寫導航欄，router都不知道怎么用，真的是hin難受啊

首先看一下我的文件目錄

再看我的路由

app.vue中的代碼，配合elementUI

<el-container>

　　<el-header></el-header>

　　<el-container>  

　　　　<el-aside style="width: auto;">

　　　　　　<el-menu class="el-menu-vertical-demo" :default-active="this.$router.path" @select="handleSelect" @open="handleOpen" @close="handleClose" router :collapse="isCollapse">

　　　　　　　　<template v-for="(item, index) in items">

　　　　　　　　　　<el-submenu v-if="item.message" :index="item.pathname" v-bind:key="index">

　　　　　　　　　　　　<template slot="title"><i class="el-icon-message"></i>

　　　　　　　　　　　　　　<span slot="title">{{ item.name }}</span>

　　　　　　　　　　　　</template>

　　　　　　　　　　　　<el-menu-item-group>

　　　　　　　　　　　　　　<el-menu-item :index="itemChild.pathname" v-for="itemChild in item.message" v-bind:key="itemChild.index">{{ itemChild.select }}</el-menu-item>

　　　　　　　　　　　　</el-menu-item-group>

　　　　　　　　　　</el-submenu>

　　　　　　　　　　<el-menu-item v-else :index="item.pathname" v-bind:key="index">

　　　　　　　　　　　　<i class="el-icon-message"></i>

　　　　　　　　　　　　<span slot="title" style="color: #777;">{{ item.name }}</span>

　　　　　　　　　　</el-menu-item>

　　　　　　　　　</template>

　　　　　　　　</el-menu>

　　　　　　</el-aside>

　　　　　　<el-main>

　　　　　　　　<router-view></router-view>

　　　　　　</el-main>

    </el-container>

</el-container>

主要就是配置好路由，配合Element組件，el-menu標簽中直接設置router，el-submenu 標簽和el-menu-item 標簽中設置好唯一標識index，index和path匹配，類似於我的pathname

就不用再使用router-link標簽了，頁面跳轉渲染組件用router-view標簽