基于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 相关文章推荐
javascript 简练的几个函数
Aug 29 Javascript
一个js控制的导航菜单实例代码
Dec 03 Javascript
js中的如何定位固定层的位置
Jun 15 Javascript
jQuery及JS实现循环中暂停的方法
Feb 02 Javascript
基于Arcgis for javascript实现百度地图ABCD marker的效果
Sep 12 Javascript
限制复选框最多选择项的实现代码
May 30 Javascript
原生JS实现图片左右轮播
Dec 30 Javascript
node.js入门教程之querystring模块的使用方法
Feb 27 Javascript
VUE长按事件需求详解
Oct 18 Javascript
jQuery滑动效果实现方法分析
Sep 05 jQuery
解决Vue中引入swiper,在数据渲染的时候,发生不滑动的问题
Sep 27 Javascript
node.js的Express服务器基本使用教程
Jan 09 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
ThinkPHP实现动态包含文件的方法
2014/11/29 PHP
PHP使用Nginx实现反向代理
2017/09/20 PHP
PHP的mysqli_select_db()函数讲解
2019/01/23 PHP
一个javascript参数的小问题
2008/03/02 Javascript
javascript getElementsByClassName实现代码
2010/10/11 Javascript
js点击更换背景颜色或图片的实例代码
2013/06/25 Javascript
js判断横竖屏及禁止浏览器滑动条示例
2014/04/29 Javascript
js实现按一下删除键删除整个单词附demo
2014/09/05 Javascript
基于 Node.js 实现前后端分离
2016/04/23 Javascript
Bootstrap Fileinput文件上传组件用法详解
2016/05/10 Javascript
vue-router跳转页面的方法
2017/02/09 Javascript
Vue.js鼠标悬浮更换图片功能
2017/05/17 Javascript
angular中使用Socket.io实例代码
2017/06/03 Javascript
three.js实现3D视野缩放效果
2017/11/16 Javascript
jQuery 实现左右两侧菜单添加、移除功能
2018/01/02 jQuery
解决element-ui中下拉菜单子选项click事件不触发的问题
2018/08/22 Javascript
vue 属性拦截实现双向绑定的实例代码
2018/10/24 Javascript
Vue插件从封装到发布的完整步骤记录
2019/02/28 Javascript
详解vue项目中实现图片裁剪功能
2019/06/07 Javascript
Vue CLI3移动端适配(px2rem或postcss-plugin-px2rem)
2020/04/27 Javascript
[52:10]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第二场 6.3
2018/06/04 DOTA
python字符串连接的N种方式总结
2014/09/17 Python
使用Python实现一个简单的项目监控
2015/03/31 Python
简单介绍Ruby中的CGI编程
2015/04/10 Python
Python使用sorted排序的方法小结
2017/07/28 Python
详解python里使用正则表达式的分组命名方式
2017/10/24 Python
无惧面试,带你搞懂python 装饰器
2020/08/17 Python
Canvas波浪花环的示例代码
2020/08/21 HTML / CSS
马克华菲官方商城:Mark Fairwhale
2016/09/04 全球购物
德国户外商店:eXXpozed
2020/07/25 全球购物
Linux如何修改文件和文件夹的权限
2013/09/05 面试题
2014年艾滋病防治工作总结
2014/12/10 职场文书
2016感恩母亲节校园广播稿
2015/12/17 职场文书
《用字母表示数》教学反思
2016/02/17 职场文书
【DOTA2】半决赛强强对话~ PSG LGD vs EHOME - DPC 2022 CN REGIONAL FINALS WINTER
2022/04/02 DOTA
《勇者辞职不干了》ED主题曲无字幕动画MV公开
2022/04/13 日漫