vue-router2 使用

VUE-ROUTER2  API http://router.vuejs.org/zh-cn/api/router-link.html

 

1,安装vue-router npm install vue-router

2.在js 导入vue-router

import VueRouter from 'vue-router';

和要跳转的页面

3.注册路由vue-router

//注册路由

Vue.use(VueRouter);

 

4.

//实例化路由

const router = new VueRouter({

mode:'hash',

routes: [

{path:'/runRedLight',component: runRedLight},

{path:'/trafficLightRoad',component: trafficLightRoad},

]

})

 

 

5.设置初始页

router.push('/runRedLight')

 

6.注入到vue

new Vue({

el: '#app',

router, //注入

template: '<App/>',

components: { App }

});

 

7.设置要渲染的位置

<router-view></router-view>

把这句话放在要渲染的位置

 

8.設置菜单栏 

<router-link to="home">Home</router-link>

 

学习笔记，如有不足请多多指教