Vue2+3 第六章 Vue路由-vue-router

6.1 相关理解

6.1.1 vue-router的理解

vue的一个插件库,专门用来实现SPA应用

6.1.2 SPA应用

1.单页web应用(single page web application,SPA)

2.整个应用只有一个完整的应用

3.点击页面中的导航链接不会刷新页面,只会做页面的局部更新

4.数据需要通过ajax请求获取

6.1.3 路由的理解

1.什么是路由?

　　一个路由就是一组映射关系,key-value

　　key为路径,value可能是function 或者 component

2.路由分类

　　后端路由:

　　　　1)理解:value是function,用于处理客户端提交的请求.

　　　　2)工作过程:服务器接受到一个请求时,根据请求路径找到匹配的函数来处理请求,返回响应数据.

　　前端路由:

　　　　1)理解:value是component,用于展示页面内容.

　　　　2)工作过程:当浏览器的路径改变时,对应的组件就会显示.

6.2 路由基本使用

1.安装vue-router

2.应用插件

3.编写router配置项

4.实现切换

5.指定展示位置

6.几个注意点:

　　1.路由组件通常放在pages文件夹,一般组件通常存放在components文件夹

　　2.切换后,路由组件默认是被销毁的,需要的时候再重新挂载

　　3.每个组件都有自己的$route属性,里面存储着自己的路由信息

　　4.整个应用只有一个router,可以通过组件的$router属性获取到

6.3 嵌套(多级)路由

6.4 路由传参

6.5 编程式路由导航

6.6 缓存路由组件

6.7 两个新的生命周期钩子

6.8 路由守卫

6.8.1 全局前置路由守卫

router.beforeEach

6.8.2 全局后置路由守卫

router.afterEach

6.9 history模式与hash模式