关于vue项目中的注意点
1.在路由配置中,一般会有根路径“/”,跟自己定义的路径一样的,这是需要写个重定向,如
文章图片
image.png
2.vue中的路径跳转问题
this.route指的是单前的路由信息,this.$router指的是整个项目的路由信息
- 【关于vue项目中的注意点】
是一个容器,用来放置需要切换的组件。
4.用这个标签来实现a跳转,to后面是目标路径,如tag="li",就是把这个标签解析为li标签。
路径的跳转也可以写成绑定属性的形式
文章图片
image.png
第二个箭头query里面传递的参数直接在url上显示
文章图片
image.png
5.在不同页面显示不同的信息时候(如脚部每个页面的取舍),需要使用命名视图,这是需要在router-view上添加name属性,如
文章图片
image.png
这样才能去判断渲染哪一个部分,这时需要重新写路由配置
文章图片
image.png
default表示默认需要渲染的样式,footer为定义的名称,定义的名称显示的内容就根据router-view后是否带有name值u判断。
当只渲染一个页面时,就使用component。
7.导航守卫(路由发生切换时候判断允不允许你跳转)
判断当前路由需不需要验证,就需要使用路由元信息,如
文章图片
image.png 则表示home页面不需要验证信息,需要的话则true
全局的导航守卫
文章图片
image.png 局部的导航守卫(三种状态,进入,更新,离开)
文章图片
image.png
推荐阅读
- vue-cli|vue-cli 3.x vue.config.js 配置
- 2020-04-07vue中Axios的封装和API接口的管理
- 关于QueryWrapper|关于QueryWrapper,实现MybatisPlus多表关联查询方式
- 四首关于旅行记忆的外文歌曲
- 醒不来的梦
- 关于自我为中心的一点感想
- 「按键精灵安卓版」关于全分辨率脚本的一些理解(非游戏app)
- 17|17 关山松 第二课作业#公众号项目# D20
- RxJava|RxJava 在Android项目中的使用(一)
- 关于Ruby的杂想