场景:

pageA----pageB(pageB包含三个二级路由)

默认进入pageB时进入第一个页面的路由,之后点击左侧按钮,分别进入其他二级路由

原router.js写法:

//应用信息
    {
        path:'/app-manage',
        name:'app-manage',
        component:AppManage,
        redirect:'/app-manage/appMsg',
        children:[
            //应用信息
            {
                path:'/app-manage/appMsg',
                name:'appMsg',
                component:AppMsg,
            },
            ...其他子路由...
        ]
    },
页面路由跳转写法:
<router-link class="lis" tag="li" v-for="(item,index) in side" :to="{path:item.url,query:{appMsg}}" :key="index">
       {{item.name}}
</router-link>
问题,一次进入默认路由时,不传递参数,只有在之后的点击第一个路由时才传递
解决方法:
1.去除router.js的redirect属性
2.在pageB页面第一次页面加载请求到数据后添加
let appMsg = this.appMsg
 this.$router.push({path:'/app-manage/appMsg',query:{appMsg}})

vue解决二级路由redirect(默认路由)不传参的问题的更多相关文章

  1. vue路由对不同界面进行传参及跳转的总结

    最近在做一个公众号的商城项目,主要用的VUE+MUI,其实今天这个点对于有过项目经验的前端工作者来说是最基础的,但也是必须要掌握的,今天小编主要是记录下传参和跳转的一些总结(仅供参考). 首先我们先上 ...

  2. vue 通过 name 和 params 进行调整页面传参刷新参数丢失问题&vue路由可选参数

    vue  通过 name 和 params 进行调整页面传参刷新参数丢失问题 router.js: export default new Router({ routes: [ { path: '/', ...

  3. vue 路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  4. Vue中的路由 以及默认路由跳转

    https://router.vuejs.org/ vue路由配置: 1.安装 npm install vue-router --save / cnpm install vue-router --sa ...

  5. WebApi-2 自定义路由与默认路由

    向Web API添加路由 public static void Register(HttpConfiguration config) { //// Web API 配置和服务 //// 将 Web A ...

  6. 路由的query参数(传参)

    路由组件不会在组件里面放自己组件标签. 案例使用嵌套组件的,但是在Message组件下新增了组件Detail.vue index.html //引入bootstrap.css <link rel ...

  7. react路由的跳转和传参

    1.路由的跳转 一.DOM跳转 在需要跳转的页面导入import {Link} from 'react-router-dom',在需要跳转的地方使用link标签的to属性进行跳转,路由配置文件中导出的 ...

  8. vue中嵌套的iframe中控制路由的跳转及传参

    在iframe引入的页面中,通过事件触发的方式进行传递参数,其中data是一个标识符的作用,在main.js中通过data进行判断,params是要传递的参数 //iframe向vue传递跳转路由的参 ...

  9. 在ensp上静态路由以及默认路由基本配置

    原理 实验模拟 实验拓扑 实验参数 测试连通性 两台PCping一下,发现超时 为什么呢我们可以看一下这个路由表,发现没有网段为20的信息,所以我们要加上 加入当访问地址为20网段时,设置下一跳路由器 ...

  10. vue2.0路由(跳转和传参)经典介绍

    声明式 <router-link :to="...">编程式router.push(...) router.push('home')                 / ...

随机推荐

  1. C# Winform 图片 Base64 转换

    //图片 转为 base64编码的文本 private void button1_Click(object sender, EventArgs e) { OpenFileDialog dlg = ne ...

  2. 前端ajax调用后端下载Excel模板流,解决输出乱码等问题

    JavaScript方法function importTemplate() { $.ajax({ url: "/importTemplate", type: "get&q ...

  3. Java实现栈

    package algorithm; import java.util.Arrays; import java.util.Iterator; /** @author Administrator @da ...

  4. 5W1H聊开源之What——开源协议有哪些?

    开源许可协议是指开源社区为了维护作者和贡献者的合法权利,保证软件不被一些商业机构或个人窃取,影响软件的发展而开发的协议.开源协议规定了用户在使用开源软件时的权利和责任,虽然不一定具备法律效力,但是当涉 ...

  5. #树形dp#nssl 1469 W

    分析 首先一些结论,每条边最多被翻一次,而且由翻的边所构成的连通块答案就是度数为奇数的点的个数的一半, 因为在连通块内必然选择两个叶子节点间的路径翻是最优的,所以也就是选择两个度数为奇数的点,所以结论 ...

  6. 使用OHOS SDK构建flac

    参照OHOS IDE和SDK的安装方法配置好开发环境. 从github下载源码. 执行如下命令: git clone --depth=1 https://github.com/xiph/flac 进入 ...

  7. winrt新dx截图最小实现

    转自:https://stackoverflow.co/questions/11283015 效果还是很不错的 #include <iostream> #include <Windo ...

  8. 第十六篇:jQuery基础

    一.jQuery和Dom的关系 http://jquery.cuishifeng.cn/ 模块,类库 DOM/BOM/JavaScript的类库: 二.jQuery选择器 1.查找元素 DOM: 10 ...

  9. 在centOS上配置web服务器

    centos,web服务,apache,ftp服务器,mysql,makefile (1). 检查系统是否正常 # more /var/log/messages //检查有无系统内核级错误信息 # d ...

  10. css 居中的汇总

    前言 对css居中的几种方式汇总,并且分析适用情况. 正文 margin+position .CenterParent { position: relative; height: 200px; wid ...