04-Vue全家桶-前端路由.pdfVIP

Vue全家桶-前端路由 目  路由的基本概念与原理 C  vue-router的基本使用 o n  vue-router嵌套路由 t  vue-router动态路由匹配 e n  vue-router命名路由 t s  vue-router编程式导航  基于vue-router的案例 1.路由的基本概念与原理 1.1 路由 路由是一个比较广义和抽象的概念，路由的本质就是对应关系。 在开发中，路由分为：  后端路由  前端路由 1.路由的基本概念与原理 1.1 路由 1. 后端路由  概念：根据不同的用户 URL 请求 ，返回不同的内容  本质：URL 请求地址与服务器资源之间的对应关系 服务器 URL地址 后 服务器资源内容 浏览器 端 路 由 后端路由根据不 同的URL地址分 发不同的资源 1.路由的基本概念与原理 1.1 路由 2. SPA （Single Page Application ）  后端渲染（存在性能问题）  Ajax前端渲染（前端渲染提高性能，但是不支持浏览器的前进后退操作）  SPA （Single Page Application ）单页面应用程序：整个网站只有一个页面，内 容的变化通过Ajax局部更新实现、同时支持浏览器地址栏的前进和后退操作  SPA实现原理之一：基于URL地址的hash （hash的变化会导致浏览器记录访问历 史的变化、但是hash的变化不会触发新的URL请求）  在实现SPA过程中，最核心的技术点就是前端路由 1.路由的基本概念与原理 1.1 路由 2. 前端路由  概念：根据不同的用户事件 ，显示不同的页面内容  本质：用户事件与事件处理函数之间的对应关系 浏览器 用户触发事件 前 事件处理函数 端 事件函数渲染相应内容 路 用户 由 前端路由负责事件 监听，触发事件后 ，通过事件函数渲