【vue】路由的基本使用

固定理论：

实践：

1.下载 v3.6.5

npm add vue-router@3.6.5

2.引入

3.注册

4.创建路由对象

对象名字一般写router，否则下面的注入不能简写

5. 注入到new Vue中，建立关联

router：对象名

对象名为router时，可简写成一个router

核心理论：

路由出口 → 匹配的组件所展示的位置（防止再切换页面的时候组件乱跑）

  <router-view></router-view>

注意：路径无点在前面

实践：

1. 建组件(views目录)，配规则

建组件

配规则

出现名字太短的报错，此时就给路由加上个名字

继续配置剩下的规则

2. 准备导航链接，配置路由出口(匹配的组件展示的位置)

此时就配置好路由了

要更换路由位置时，只需要把路由展示组件标签换位置即可

总结：