1. 程式人生 > >vue1.0配置路由

vue1.0配置路由

應用 span log pan 啟用 技術分享 .cn style 位置

1,//創建 router 實例

  var router = new VueRouter()

2,//components下新建home.vue組件,並在app.vue中引入模塊:

import home from ‘./components/home/home.vue‘;

3,//路由地址

  router.map({

//路由規則

})

4,//啟動一個啟用了路由的應用

  router.start(App,‘app‘)

5,Vue作用範圍內設置路由跳轉

  <a v-link="{path:‘/home‘}"></a>

  <router-view></router-view>//路由渲染出來的內容的位置

main.js文件如下:

技術分享

路由嵌套:

1,新建Login.vue 和 Reg.vue

2,import引入

3,subroute設置

4,vue文件設置 <a a-link="{path:‘地址‘}"></a>設置路由跳轉地址

.vue文件如下

技術分享

main.js文件如下

技術分享

vue1.0配置路由