vue-router(一)

profile:vue-routerはVue.js公式が提供するルーティング・プラグインであり、単一ページアプリケーションvue-routerを構築するためには、コンポーネントのルーティングに基づいて特定のアクセス・パスを設定するために使用され、経路とコンポーネントがマッピングされ、vue-router単一ページアプリケーションにおいてページの経路変更はコンポーネント間の切り替えである.

   :
      npm install vue-router --save
   :
     
1.      import...     Vue.use(...)
2.      ,      
3.           

import VueRouter from 'vue-router'//      
import Home from '../views/Home.vue'

Vue.use(VueRouter)//      

const routes = [//                  
{
  path: '/',
  name: 'Home',
  component: Home
},
{
  path: '/about',
  name: 'About',
  component: () => import('../views/About.vue')//     
}
]
const router = new VueRouter({
mode: 'history',//    
base: process.env.BASE_URL,
routes
})

export default router//        

ルートのマウント

import Vue from 'vue'
import App from './App.vue'
import router from './router'//       

Vue.config.productionTip = false

new Vue({
  router,// vue           
  render: h => h(App)
}).$mount('#app')