Vue Router 命名路由

给路由命名可以简化跳转的代码，适用于路径层级较多的情况

1. 给路由命名

   import Vue from 'vue';
   import VueRouter form 'vue-router';
   import Manage from '@/pages/Manage';
   import List from '@/pages/List';
   import Detail from '@/pages/Detail';
   Vue.use(VueRouter);
   export default new VueRouter({
   	routes: [{
   		path: '/manage',
   		component: Manage,
   		children: [{
   			path: 'list',
   			component: List,
   			children: [{
   				name: 'xiangqing'        // 使用name属性为路由命名
   				path: 'detail',
   				component: detail
   			}]
   		}]
   	}]
   });
   

2. 使用命名路由
   【通过name方式跳转，to必须是对象的形式】

   <template>
   	<div>
   		<router-link :to="{name: 'xiangqing'}">进入详情</router-link>   <!-- name写法，简单-->
   		<router-link :to="{
   			path: '/manage/list/detail'
   		}"></router-link> <!-- path写法 -->
   		<router-view></router-view>
   	</div>
   </template>