一、Vue-router引入使用

Vue-router就是一個vue路由類，通過new一個Vue路由實例，然後Vue.use()嵌入即可。

一般分為以下步驟：

1.引入

（1）、方法一：npm包嵌入，然後引入

import Vue from ‘vue‘
import VueRouter from ‘vue-router‘

（2）、CDN直接引入（練習使用）

<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>

2.配置路由對象+創建VueRouter實例

（1）、配置路由對象

// 路由配置對象
        const routes = [
            {
                path: ‘/‘,
                component: A
            },
            {
                path: ‘/A/:id‘,
                component: A
            },
            {
                path: ‘/B/:id‘,
                component: B
            }
        ];
 

（2）、創建VueRouter實例

// 將路由配置對象作為參數
        const router = new VueRouter({
            routes
        });

3.將創建的VueRouter實例傳入創建的Vue實例中

const app = new Vue({
            router
        }).$mount(‘#app‘);

二、Vue-router路由配置

---------------

Vue-router學習（一）- 路由匹配