参考地址:https://blog.csdn.net/bluefish_flying/article/details/81011230

router.js中

路由设置这里,

当你使用params方法传参的时候,要在路由后面加参数名,并且传参的时候,参数名要跟路由后面设置的参数名对应。(params一旦设置在路由,params就是路由的一部分,如果这个路由有params传参,但是在跳转的时候没有传这个参数,会导致跳转失败或者页面会没有内容。)

使用query方法,就没有这种限制,直接在跳转里面用就可以。

所以,解决标题中问题的办法两种:

1,用query传参

2.用params传参,并在router.js路由里添加型如/router1/:id的设置

vue params和query传参区别的更多相关文章

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

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

  2. params 和 query 传参的区别

    很多人都知道params 和  query  都可以在页面跳转的时候传递参数. query更加类似于我们ajax中get传参,params则类似于post,说的再简单一点,前者在浏览器地址栏中显示参数 ...

  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配置路由和传参方式及路由守卫!

    安装路由 npm i vue-router -S 引入路由 import VueRouter form VueRouter 注入路由模块 Vue.use(VueRouter) 定义路由匹配规则 let ...

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

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

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

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

  9. 前台VUE的组件之间传参方式

    路由传参 """ 转跳: <router-link :to="'/course/'+course.id">{{course.name}}& ...

随机推荐

  1. des加密delphi与c#

    des加密delphi与c# C#默认是CBC,PKCS7

  2. Django基础介绍

    1.web应用 Web应用程序是一种可以通过Web访问的应用程序,程序的最大好处是用户很容易访问应用程序,用户只需要有浏览器即可,不需要再安装其他软件. 应用程序有两种模式C/S.B/S.C/S是客户 ...

  3. LeetCode题解 Permutations II 和 Permutations I ——回溯算法

    这个算法感觉还是很陌生的.算法导论里没有讲这个算法,而数据结构与算法分析只用了一节来阐述.我居然跳过去了..尴尬. 笨方法解决的: 第一题: 给定一个元素不重复的数组,枚举出他们的全排列. 方法1:递 ...

  4. 链表有环判断,快慢指针两种方法/合并链表/删除重复元素/二分递归和while

    public static boolean hasCycle(ListNode head) { if (head == null || head.next == null) { return fals ...

  5. numpy笔记

    numpy数组切片 import numpy as np arr = np.empty((8, 3))for i in range(8): arr[i] == i arr[1,2] # 选取第1行第2 ...

  6. linux内核中的const成员是否可以修改?

    本文的基础知识:由于前半部分内容是转的,且不知道原文出处,没法给出原文地址,大家自行百度 const的实现机制 const究竟是如何实现的呢?对于声明为const的内置类型,例如int,short,l ...

  7. mybatis 获取insert返回的主键

    在我们开发过程中,在插入数据到数据库时,很多时候都需要把其主键返回,这里就说一下mybatis是怎么获取的. 其中mysql和oracle是不同的做法,因为mysql本身就提供字段自增的属性,而ora ...

  8. Webservice之axis

    根据wsdl的url,使用axis1.4生成客户端,并且对webservice进行调用   1.到www.apache.org上去下载axis-bin-1_4.zip,如要关联源代码就把axis-sr ...

  9. python类中方法加单下划线、双下划线、前后双下滑线的区别

    首先看一段代码: class Foo(): def __init__(self): print "__init__ method" def public_method(self): ...

  10. 内核进程切换 switch_to

    参考: http://www.cnblogs.com/visayafan/archive/2011/12/10/2283660.html