1. 程式人生 > >Vue實現路由跳轉 vue-router

Vue實現路由跳轉 vue-router

首先,我們先下載安裝路由(模組化)

npm i vue-router -s

接著在啟動檔案中啟用該路由(配置路由規則)

“../pages/DmMyself”是我的路徑,大家自行修改你們的路徑

import Vue from 'vue'  
import Router from 'vue-router'  
import DmMyself from '../pages/DmMyself'

我們在引入下(註冊)

配置路由登錄檔(/myself 我的路徑,大家自行修改,name/compoent大家也根據自己的名稱修改)

Vue.use(Router)
export default new Router({ 
     routes: [
           {
                path:'/myself', name:'DmMyself', component:DmMyself
            }
      ]
})

接著在根元件下佔個位置

<router-view></router-view>

最後,我需要點選“我的”,跳轉到DmMysele頁面

<router-link to="/myself">我的</router-link>