Vue-day6 路由!

一.路由入门

单页应用程序

所有功能在一个html页面实现

路由概念
路由是一种映射关系,Vue中的路由作用:路径和组件的映射关系
根据路由就能知道不同路径的,应该匹配渲染哪个组件

VueRouter的基本使用5+3

5个基本步骤

/1.下载v3.6.5

//2.引入

//3.安装注册 Vue.use(vue插件)

//4.创建路由对象 yarn add vue-router@3.6.5

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

2个核心步骤

1.建组件(views),配规则

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

组件目录存放问题

页面组件

页面组件-views文件夹=>配合路由,页面展示

复用组件

复用组件-components文件夹=>封装复用

二.路由进阶

1.路由模块封装

2.声明式导航&导航高亮

精准匹配&模糊匹配

自定义高亮类名

声明式导航传参(查询参数传参&动态传参)

3.路由重定向

路由404

路由模式

编程式导航传参(查询参数传参&动态传路由参)

三.面经基础

一级路由/二级路由/导航高亮/请求渲染/路由传参/缓存组件