父子间的组件通讯是通过props和$emit来实现的,那么路由之间的通讯呢,往下看:

我现在再webpack里面有一个这样的结构,

我现在想test1里面的按钮点击跳转到test2里面,获得到test1传递过来的id和age,

路由我们可以这么写:

{
path: "/test2/:id/:age",
component:test2,
// props:{id:"fang",age:18}
props:true
}

  test1.vue:

test2.vue:

效果:

本人写的比较简单一些,具体可以看一下官方的文档说明,不会的一起交流一下

vue向路由组件传递props的更多相关文章

  1. Vue 给子组件传递参数

    Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...

  2. vue_VueRouter 路由_路由器管理n个路由_并向路由组件传递数据_新标签路由_编程式路由导航

    路由:就是一个 key 与 value 的映射关系.key 就是 pathh 前台路由的 value 是 Component 组件对象 后台路由的 value 是一个 回调函数 普通链接: 会发送请求 ...

  3. vue的通讯与传递props emit (简单的弹框组件)

    props父把信息传递给子组件 1父组件 <template> <div class="hello"> <div id="app-3&quo ...

  4. vue嵌套路由-query传递参数(三)

    在嵌套路由中我们经常会遇到父路由向子路由里面传递参数,传递参数有两种方法,通过 query 或者 params index.html <div id="app"> &l ...

  5. vue.js 父子组件间 props 数据同步处理

    常见的场景: 在一个vue组件A中,使用另外一个组件B.A将自己的数据通过B组件的Props属性(propX)传递到B组件实例内部,B组件内部会修改该Props属性(propX)的值,此时在A组件内部 ...

  6. vue中父组件使用props或者$attras向子组件中传值

    知识点:vue中使用props或者$attras向子组件中传值 (1) props传值 子组件必须注册好要传的数据() props:['id'] (2)$attrs传值 该数据在props中,没有注册 ...

  7. vue 父子父组件通过props传父页面请求后的数据

    父子父组件通过props传父页面请求后的数据,则在父页面的子组件上加上判断数据是否存在即可,如下 <gl-line-bar v-if="oneWeekBetEcharts" ...

  8. 详解vue父组件传递props异步数据到子组件的问题

    案例一 父组件parent.vue // asyncData为异步获取的数据,想传递给子组件使用 <template> <div> 父组件 <child :child-d ...

  9. [转]详解vue父组件传递props异步数据到子组件的问题

    原文地址:https://www.cnblogs.com/goloving/p/9114389.html 案例一 父组件parent.vue // asyncData为异步获取的数据,想传递给子组件使 ...

随机推荐

  1. PHP位运算符(转)

    例子 名称 结果 $a & $b And(按位与) 将在 $a 和 $b 中都为 1 的位设为 1. $a | $b Or(按位或) 将在 $a 或者 $b 中为 1 的位设为 1. $a ^ ...

  2. 执行 maven 命令 报错Unable to add module to the current project as it is not of packaging type 'pom'[转]

    今天学习在本地搭建Maven工程时,执行了mvn archetype:generate 命令,报错. Unable to create project from archetype [org.apac ...

  3. Redis总结(七)Redis运维常用命令(转载)

    redis 服务器端命令 redis 127.0.0.1:6380> time  ,显示服务器时间 , 时间戳(秒), 微秒数 1) "1375270361" 2) &quo ...

  4. 从JSON数据中取出相关数据

    参考: http://www.cnblogs.com/shuilangyizu/p/6019561.html JSON数据如下: { "total": 1, "rows& ...

  5. apache 2.2设置单IP多端口的虚拟主机

    系统配置为Centos 5.5 x85版,使用yum安装httpd 对于没有安装vim的,可以使用此命令安装:   yum -y install vim-enhanced 配置httpd.conf文件 ...

  6. Qt 检验器 三种典型类的用法

    Qt提供了三个内置验证器类: QDoubleValidator, QIntValidator, QRegExpValidator. QDoubleValidator类: 提供了对浮点数的范围检查. Q ...

  7. Android 利用fastjson进行json解析

    package com.example.FastJson.util; import com.alibaba.fastjson.JSON; import com.alibaba.fastjson.Typ ...

  8. 关于DebuggerHidden特性在Unity中的使用

    经过测试,DebuggerHidden只对输出的日志有影响.对编辑器的控制台输入没有影响 你可以通过这个特性避免日志log有一堆的堆栈信息 并且测试过发现Debug.LogError也不支持该特性,和 ...

  9. SMBUS的介绍与访问

    博文是为了总结自己在bios学习上面的点点滴滴,并且加深印象,由于本人水平有限,难免存在不足之处,望指正,同时感谢CSDN提供的平台.本文主要介绍的是SMBUS. 1  SMBUS的简介 特点: SM ...

  10. Out of Hay(poj2395)(并查集)

    Out of Hay Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 11580   Accepted: 4515 Descr ...