问题:

  在做项目的过程中,使用query传参数,发现跳转过程中第一次有参数,但是路由马上又跳转了一次,然后 ?和它之后的参数都不见了

问题分析:

  因为路由加载了两次

解决办法:

·1. 找到总的 layout.vue 组件,查看监听路由的代码,果然是因为我又重新push了一次路由导致的

watch:{   //监听路由变化
'$route.path': function (newVal, oldVal) {
if (newVal !== oldVal) {
this.$router.push(newVal) // 重新加载了一个新路由
}
}
},

删掉这行代码,就可以啦!!!

vue-router 使用query传参跳转了两次(首次带参数,跳转到了不带参数)的更多相关文章

  1. vue params和query传参区别

    参考地址:https://blog.csdn.net/bluefish_flying/article/details/81011230 router.js中 路由设置这里, 当你使用params方法传 ...

  2. Vue Router的params和query传参的使用和区别

    vue页面跳转有两种方式分别是:name和path this.$router.push({name: 'HelloWorld2}) this.$router.push({path: '/hello-w ...

  3. (转)vue router 如何使用params query传参,以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  4. vue router 如何使用params query传参,以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  5. react router @4 和 vue路由 详解(六)vue怎么通过路由传参?

    完整版:https://www.cnblogs.com/yangyangxxb/p/10066650.html 8.vue怎么通过路由传参? a.通配符传参数 //在定义路由的时候 { path: ' ...

  6. vue父子组件路由传参的方式

    一.get方式(url传参): 1.动态路由传参: 父组件: selectItem (item) { this.$router.push({ path: `/recommend/${item.id}` ...

  7. vue:解决使用param传参后,再次刷新页面会新增一个原有的tab

    问题:在最近的项目中,我通过传递不同的参数,复用同一组件进行渲染,然而意外出现一个bug,就是当我重新刷新该页面时,会新增一个tab 原来的: 刷新页面后: 查阅资料后,发现该现象是由于通过param ...

  8. Vue的组件及传参

    目录 Vue的组件及传参 Vue组件的概念 根组件 子组件(局部组件) 父组件向子组件传值 子组件向父组件传值 Vue的组件及传参 Vue组件的概念 我们首先要知道组件的概念,实际上每一个组件都是一个 ...

  9. vue router使用query和params传参的使用

    传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,希望可以帮到大家. Vue ...

随机推荐

  1. Java精通并发-从Thread与Runnable说起

    java并发的学习从去年就已经中断了,之前只对于java并发的一些基础进行了一些巩固,对于这个硬技能不管是对于面试还是对于日常的实际开发来说都非常之重要,所以接下来给自己重新定一个新目标,准备重拾它一 ...

  2. 《少年先疯队》第九次团队作业:Beta冲刺与团队项目验收

    博文简要信息表: 项目 内容 软件工程 https://www.cnblogs.com/nwnu-daizh/ 本次实验链接地址 https://www.cnblogs.com/nwnu-daizh/ ...

  3. vscode——设置自动保存

    前言 懒就一个字 步骤 打开设置第一项就是,选择焦点改变自动保存即可

  4. 八.Protobuf3更新消息类型(添加新的字段)

    Protobuf3 更新消息类型 如果现有的消息类型不满足你的所有需求——例如,你希望消息格式有一个额外的字段——但是你仍然希望使用用旧格式创建的代码,别担心!在不破坏任何现有代码的情况下更新消息类型 ...

  5. Codeforces Round #604 (Div. 2) A. Beautiful String

    链接: https://codeforces.com/contest/1265/problem/A 题意: A string is called beautiful if no two consecu ...

  6. Default Trace 查找日志文件快速增长的原因

    select loginname, loginsid, spid, hostname, applicationname, servername, databasename, objectname, e ...

  7. 轮播图方法一,把每个slider-item看成一个对象进行轮播

    focus-slider 只用于存放轮播图片,方便修改图片内容 其他的按照默认创建即可. 注意这里的slider.html文件是在 text文件下面  index.html <!DOCTYPE ...

  8. @NotNull,@NotEmpty,@NotBlank区别

    示例结果: // null String name = null; @NotNull: false @NotEmpty: false @NotBlank: false // 空字符串 String n ...

  9. FTP与HTTP上传文件的对比

    许多站点,比如facebook或一些博客等都允许用户上传或下载文件,比如论坛或博客系统的图片. 在这种情况下,通常有两种选择上传文件到服务器,那就是FTP协议和HTTP协议. 以下列出了一些两者的不同 ...

  10. 洛谷P3964松鼠聚会

    题目 题意:求最小的从某一个点到其余点的切比雪夫距离和. 将一个图中的\((x,y)\)坐标转到新坐标\((x+y,x-y)\)后,图中的曼哈顿距离就是新图中的切比雪夫距离, 证明:分类讨论, 1.\ ...