持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第8天,点击查看活动详情
1.router还有routers都是什么?
众所周知Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成,让用 Vue.js 构建单页应用变得轻而易举
功能包括:
- 嵌套路由映射
- 动态路由选择
- 模块化、基于组件的路由配置
- 路由参数、查询、通配符
- 展示由 Vue.js 的过渡系统提供的过渡效果
- 细致的导航控制
- 自动激活 CSS 类的链接
- HTML5 history 模式或 hash 模式
- 可定制的滚动行为
- URL 的正确编码
但是router与routes都是些什么呢?有什么区别?且听我娓娓道来
1.router
通过控制台打印,可以看出来,route其实是一个对象,这里面包含了很多路由信息,包括‘path,hash,query,fullPath,matched,name等等一些路由信息的参数
接下来看看$router打印出来了什么?
可以看到$router包含很多属性和方法,如此一来答案便呼之欲出了:
route要牛一点........(多了个r就是牛一点?)
还真是!敲黑板 $route是一个局部的路由对象,只能用于当前跳转的路由
而$router是一个全局的实例对象
包括了路由的跳转方法比如push(跳转页面)replace(替换页面),go(页面的前进或者后退)
任何页面都可以调用!
实际开发中因vue-router提供了一个全局组件router-link来替代a标签进行跳转,自带激活时的类名, 通常我们都是用来做点击高亮功能,只需写高亮样式即可
3.routes
router是一条路由,单数的
而routes是多个路由的集合,多个数组的集合
创建vue-router路由实例的配置项。用来配置多个route路由对象