打印this.$route显示结果:

跳转路由传递参数如下

this.$router.push({
name: 'Page',
query/params: {
key: value
})
<router-link :to="{name:xxx,params:{key:value}}">valueString</router-link>

最后在跳转后的路由用 this.$route.params.paramName 和 this.$route.query.paramName 取值

用params去传值的时候,在页面刷新时,参数会消失,用query则不会有这个问题。

vue路由传值方式的更多相关文章

  1. vue路由传值params和query的区别

    vue路由传值params和query的区别1.query传参和接收参数传参: this.$router.push({ path:'/xxx' query:{ id:id } })接收参数: this ...

  2. vue中组件传值方式汇总

    在应用复杂时,推荐使用vue官网推荐的vuex,以下讨论简单SPA中的组件间传值. 一.路由传值 路由对象如下图所示: 在跳转页面的时候,在js代码中的操作如下,在标签中使用<router-li ...

  3. vue几种简单的传值方式

    除了一下的几种方式外,可以参考 https://www.cnblogs.com/hpx2020/p/10936279.html 组件传值的方法: 一.父组件向子组件传递数据(props) 第1:父组件 ...

  4. Vue 常用三种传值方式

    Vue常用的三种传值方式: 父传子 子传父 非父子传值 引用官网一句话:父子组件的关系可以总结为 prop 向下传递,事件向上传递.父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消 ...

  5. Vue的七种传值方式

    目录 1,父传子 2,子传父 3,兄弟组件传值 4,父组件使用子组件的数据和方法 5,子组件使用父组件的数据和方法 6,Vuex传值 6.1,定义store 6.2,挂载 6.3,使用 7,路由传值 ...

  6. Vue中常用的几种传值方式

    Vue中常用的几种传值方式 1. 父传子 父传子的实现方式就是通过props属性,子组件通过props属性接收从父组件传过来的值,而父组件传值的时候使用 v-bind 将子组件中预留的变量名绑定为da ...

  7. vue组件之间的传值方式

    一.父组件向子组件传值方式 1.1父组件向子组件传数据方式 <!DOCTYPE html> <html lang="en"> <head> &l ...

  8. react之传递数据的几种方式props传值、路由传值、状态提升、redux、context

    react之传递数据的几种方式 1.父子传值 父传值:<子的标签 value={'aaa'} index={'bbb'}></子的标签> 子接值:<li key={thi ...

  9. vue权限路由实现方式总结二

    之前已经写过一篇关于vue权限路由实现方式总结的文章,经过一段时间的踩坑和总结,下面说说目前我认为比较"完美"的一种方案:菜单与路由完全由后端提供. 菜单与路由完全由后端返回 这种 ...

随机推荐

  1. 为什么虚拟DOM更优胜一筹

    注意: 虚拟DOM只是实现MVVM的一种方案,或者说是视图更新的一种策略.没有虚拟DOM比MVVM更好一说. 我们回顾传统MVC框架,如backbone,它是将某个模板编译成模板函数,需要更新时,是自 ...

  2. ES6的export和import

    export import 的4种搭配 非默认 拿函数举例,常量,变量,类也可以 // 1 可以多个export--------import带上{} export var a="123&qu ...

  3. 在Virtualenv中使用Idle

    原创 在Virtualenv中使用Idle 本文适用于Linux系统,在DebianTesting上测试通过. 关于Virtualenv 先看一段Virtualenv这货的官方介绍: virtuale ...

  4. JAVA语言 第六周

    时间太快了,过几天就要去学校了.在家里学习不下去,一点不心静.学习也不如刚放假的时候了. 活在被开学支配的恐惧下,每天看一会儿视频(书是真的难看下去). 效果不明显,这个暑假已经被拉开差距 了.提前几 ...

  5. linux键盘驱动

    http://blog.csdn.net/beyondhaven/article/details/5753182 http://blog.chinaunix.net/uid-20564848-id-7 ...

  6. kafka清理

    由于项目原因,最近经常碰到Kafka消息队列拥堵的情况.碰到这种情况为了不影响在线系统的正常使用,需要大家手动的清理Kafka Log.但是清理Kafka Log又不能单纯的去删除中间环节产生的日志, ...

  7. Redis服务器开启远程访问

    重启  ps aux|grep redis root 32684 0.0 0.0 48452 6944 ? Ssl 21:27 0:00 ./redis-server *:6379 kill了这个进程 ...

  8. linux编译安装php apache mysql (已试过)

    阅读目录 (全部使用源码安装方式,先安装mysql,然后是apache,再是php,这样好像能防止挺多问题的,期间出现问题基本是依赖没有或者版本不对) 1.简介 2.安装apache 2.1.yum方 ...

  9. 2018面向对象程序设计(Java)第8周学习指导及要求

    2018面向对象程序设计(Java)第8周学习指导及要求 (2018.10.18-2018.10.21)   学习目标 掌握接口定义方法: 掌握实现接口类的定义要求: 掌握实现了接口类的使用要求: 理 ...

  10. SAP 自定义进度条

    *&---------------------------------------------------------------------* *& Report ZCHENH028 ...