基于vue-router 多级路由redirect 重定向的问题


Posted in Javascript onSeptember 03, 2018

在做多级路由的时候遇到很多问题,虽然不难,但是如果没有经验,往往要花一整天时间才能解决(可能我笨),况且网上资料也很少。

项目需要是这样的:

登录页面跳到后台页面重定向,登录页是一级路由

基于vue-router 多级路由redirect 重定向的问题

对应页面

基于vue-router 多级路由redirect 重定向的问题

登录后:

基于vue-router 多级路由redirect 重定向的问题

同时重定向二级和三级页面,

基于vue-router 多级路由redirect 重定向的问题

这样登录就会重定向了,此时url

基于vue-router 多级路由redirect 重定向的问题

但又有一个问题:当再次点击底部“堂食”的时候,

基于vue-router 多级路由redirect 重定向的问题

url变成这样,并且三级页面没有出来

基于vue-router 多级路由redirect 重定向的问题

解决办法是:在这个“堂食”按键 添加一个方法

基于vue-router 多级路由redirect 重定向的问题

记住,也只有这样传参才有效

如果在<router-link>传参,问题多多:如linkActiveClass有问题,再次点击“堂食”,没有传参,三级页面不出现等等

基于vue-router 多级路由redirect 重定向的问题

以上这篇基于vue-router 多级路由redirect 重定向的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jQuery的仿flash的广告轮播代码
Nov 04 Javascript
js 鼠标移动显示图片的简单实例
Dec 25 Javascript
jQuery动态添加、删除元素的方法
Jan 09 Javascript
jQuery中nextAll()方法用法实例
Jan 07 Javascript
JS的Ajax与后端交互数据的实例
Aug 08 Javascript
Vue.set() this.$set()引发的视图更新思考及注意事项
Aug 30 Javascript
详解如何提升JSON.stringify()的性能
Jun 12 Javascript
Vue程序调试的方法
Jun 17 Javascript
layer.open 获取不到表单信息的解决方法
Sep 26 Javascript
createObjectURL方法实现本地图片预览
Sep 30 Javascript
vue quill editor 使用富文本添加上传音频功能
Jan 14 Javascript
Vue如何使用混合Mixins和插件开发详解
Feb 05 Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
Sep 03 #jQuery
Vue-router的使用和出现空白页,路由对象属性详解
Sep 03 #Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
Sep 03 #Javascript
JavaScript日期工具类DateUtils定义与用法示例
Sep 03 #Javascript
Angular5中状态管理的实现
Sep 03 #Javascript
JavaScript创建对象方法实例小结
Sep 03 #Javascript
vue自定义底部导航栏Tabbar的实现代码
Sep 03 #Javascript
You might like
深入解析PHP的引用计数机制
2013/06/14 PHP
ThinkPHP基于PHPExcel导入Excel文件的方法
2014/10/15 PHP
php版银联支付接口开发简明教程
2016/10/14 PHP
php微信公众号开发(3)php实现简单微信文本通讯
2016/12/15 PHP
php关联数组与索引数组及其显示方法
2018/03/12 PHP
PHP过滤器 filter_has_var() 函数用法实例分析
2020/04/23 PHP
Prototype使用指南之array.js
2007/01/10 Javascript
jQuery jqgrid 对含特殊字符json 数据的 Java 处理方法
2011/01/01 Javascript
javascript动态加载实现方法一
2012/08/22 Javascript
JavaScript iframe数据共享接口实现方法
2016/01/06 Javascript
Vue数据驱动模拟实现2
2017/01/11 Javascript
JavaScript数据结构之二叉树的遍历算法示例
2017/04/13 Javascript
es7学习教程之Decorators(修饰器)详解
2017/07/21 Javascript
移动端效果之Swiper详解
2017/10/09 Javascript
js 图片懒加载的实现
2020/10/21 Javascript
Flask框架学习笔记(一)安装篇(windows安装与centos安装)
2014/06/25 Python
Python标准库之sqlite3使用实例
2014/11/25 Python
Python脚本实现虾米网签到功能
2016/04/12 Python
python+selenium实现自动化百度搜索关键词
2019/06/03 Python
python下的opencv画矩形和文字注释的实现方法
2019/07/09 Python
pytorch实现CNN卷积神经网络
2020/02/19 Python
Python抓包程序mitmproxy安装和使用过程图解
2020/03/02 Python
python数据处理——对pandas进行数据变频或插值实例
2020/04/22 Python
Python爬虫实现HTTP网络请求多种实现方式
2020/06/19 Python
打造经典复古风格的品牌:Alice + Olivia(爱丽丝+奥利维亚)
2016/09/07 全球购物
台湾菁英交友:结识黄金单身的台湾人
2018/01/22 全球购物
Nike瑞典官方网站:Nike.com (SE)
2018/11/26 全球购物
Hudson Jeans官网:高级精制牛仔裤
2018/11/28 全球购物
中东奢侈品购物网站:Ounass
2020/09/02 全球购物
急诊科护士自我鉴定
2013/10/14 职场文书
会计岗位描述
2014/02/22 职场文书
2014年社区植树节活动方案
2014/02/28 职场文书
创先争优标语
2014/06/27 职场文书
小学班主任事迹材料
2014/12/17 职场文书
2015年街道除四害工作总结
2015/05/15 职场文书
MySQL Server 层四个日志
2022/03/31 MySQL