一、 Vue router安装

【1】下载vue router

命令如下：
1.npm install vue-router
2.cnpm install vue-router
3.yarn add vue-router（这里推荐使用第三种方法，速度快报错几率小）

【2】操作

1.在src页面下下新建router.js，并引入如下代码

2.在components中新建Conten.vue，
注意：此处的目录不是必须的，在哪里建的后续保持一致即可

3.在src页面下中新建view文件夹，在view新建例如：Home文件夹，在文件夹中新建index.vue，导入上一步的Content并引入如下代码：

4、在router.js中设置如下两步
1、import Home from ‘./views/Home/’ 导入之前的Home文件夹
2、export default new VueRouter ({
routes: [
{
path: ‘/’,
redirect: ‘/home’ //设置默认指向
},
{
path: ‘/home’, 此处是之前给页面起的别名
component: Home
}，
]
})
5、在App.vue中的div内引入

6、在main.js中 import router from ‘./router’
在new的实例中增加router，具体如下：

7.刷新页面：

二、新建、跳转

1.在components（或者其他地方）新建一个child1.vue，并写入如下代码

2.在之前的views底下创建List文件夹，List文件夹下新建一个index.vue,并导入之前在components新创建的child1.vue，并写入如下代码

3.在之前的router.js中导入创建好的List,代码如下

4.刷新浏览器：
这里要注意url名字要变化

三、固定想要的页面

1.还是在components中新建几个vue
2.在home中写入如下代码：
注意：因为我想在home页面下进入所以故在此导入，home不是固定页面

3.在router.js中引入之前创建的多个vue

默认指向那里写入想要固定页面的url

4.刷新页面，