基于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 相关文章推荐
Date对象格式化函数代码
Jul 17 Javascript
jQuery获取文本节点之 text()/val()/html() 方法区别
Mar 01 Javascript
JavaScript中json使用自己总结
Aug 13 Javascript
客户端js判断文件类型和文件大小即限制上传大小
Nov 20 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
Oct 14 Javascript
JavaScript中的Object对象学习教程
May 20 Javascript
jquery简单插件制作(fn.extend)完整实例
May 24 Javascript
vue组件初学_弹射小球(实例讲解)
Sep 06 Javascript
ES6中Class类的静态方法实例小结
Oct 28 Javascript
Vue监听数据渲染DOM完以后执行某个函数详解
Sep 11 Javascript
微信小程序复选框实现多选一功能过程解析
Feb 14 Javascript
小程序Scroll-view上拉滚动刷新数据
Jun 21 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 adodb连接mssql解决乱码问题
2009/06/12 PHP
php输出1000以内质数(素数)示例
2014/02/16 PHP
php命令行(cli)模式下报require 加载路径错误的解决方法
2015/11/23 PHP
PHP中overload与override的区别
2017/02/13 PHP
yii框架结合charjs实现统计30天数据的方法
2020/04/04 PHP
图像替换新技术 状态域方法
2010/01/28 Javascript
Javascript 入门基础学习
2010/03/10 Javascript
javascript中类的定义及其方式(《javascript高级程序设计》学习笔记)
2011/07/04 Javascript
jquery的ajax()函数传值中文乱码解决方法介绍
2012/11/08 Javascript
js精度溢出解决方案
2012/12/02 Javascript
如何将JS的变量值传递给ASP变量
2012/12/10 Javascript
基于jquery实现的树形菜单效果代码
2015/09/06 Javascript
学习jQuey中的return false
2015/12/18 Javascript
JavaScript 基础表单验证示例(纯Js实现)
2017/07/20 Javascript
Node.JS更改Windows注册表Regedit的方法小结
2017/08/18 Javascript
解决vue 按钮多次点击重复提交数据问题
2018/05/10 Javascript
详解微信小程序的 request 封装示例
2018/08/21 Javascript
3分钟读懂移动端rem使用方法(推荐)
2019/05/06 Javascript
150行Node.js实现的dns代理工具
2019/08/02 Javascript
JS中的算法与数据结构之字典(Dictionary)实例详解
2019/08/20 Javascript
Vue3 中的数据侦测的实现
2019/10/09 Javascript
[36:37]2014 DOTA2华西杯精英邀请赛5 24 VG VS iG
2014/05/25 DOTA
python使用PyGame播放Midi和Mp3文件的方法
2015/04/24 Python
Python中用于转换字母为小写的lower()方法使用简介
2015/05/19 Python
pytorch 固定部分参数训练的方法
2019/08/17 Python
python mqtt 客户端的实现代码实例
2019/09/25 Python
Python如何使用paramiko模块连接linux
2020/03/18 Python
基于tensorflow __init__、build 和call的使用小结
2021/02/26 Python
css3圆角边框和边框阴影示例
2014/05/05 HTML / CSS
HTML5拖拉上传文件的简单实例
2017/01/11 HTML / CSS
英国女士家居服网站:hush
2017/08/09 全球购物
澳大利亚优惠网站:Deals.com.au
2019/07/02 全球购物
全球烹饪课程的领先预订平台:Cookly
2020/01/28 全球购物
迪斯尼假期(欧洲、中东及非洲):Disney Holidays EMEA
2021/02/15 全球购物
自荐信格式写作方法有哪些呢
2013/11/20 职场文书
导游词幽默开场白
2019/06/26 职场文书