1、路由简介
路由,其实就是指向的意思,vue的单页面应用是基于路由和组件的。html
2、路由的种类
静态路由(本人自认为)、动态路由、嵌套路由等vue
3、路由的使用
- 在src的components内建立.vue文件,实现须要后续配置路由的页面的基本配置,并在主页面即helloworld.vue定义<router-link><router-view>来实现点击部分和显示部分。
- 在src目录下,建立router.js文件,实现对自定义路由的管理。
- 将路由注入main.js根实例中,便可跑出挂在app.vue里的组件了。
摘记重点:
路由中有三个基本的概念 route, routes, router。html5
- route,它是一条路由,由这个英文单词也能够看出来,它是单数,例如: Home按钮 => home内容, 这是一条route, about按钮 => about 内容, 这是另外一条路由。
- routes 是一组路由,把上面的每一条路由组合起来,造成一个数组。例如:[{home 按钮 =>home内容 }, { about按钮 => about 内容}]
- router 是一个机制,至关于一个管理者,它来管理路由。由于routes 只是定义了一组路由,它放在哪里是静止的,当真正来了请求,怎么办? 就是当用户点击home 按钮的时候,怎么办?这时router 就起做用了,它到routes 中去查找,去找到对应的 home 内容,因此页面中就显示了 home 内容。
- 客户端中的路由,实际上就是dom 元素的显示和隐藏。当页面中显示home 内容的时候,about 中的内容所有隐藏,反之也是同样。客户端路由有两种实现方式:基于hash 和基于html5 history api.
参考博客连接:https://www.cnblogs.com/SamWeb/p/6610733.htmlapi
路由官方介绍连接:https://router.vuejs.org/zh-cn/essentials/dynamic-matching.html数组