1. <li v-for="article in articles" @click="getDescribe(article.id)">
  2.  
  1. getDescribe(id) {
  2. // 直接调用$router.push 实现携带参数的跳转
  3. this.$router.push({
  4. path: `/describe/${id}`,
  5. })
  1. this.$route.params.id
  2.  
  3. 父组件中:通过路由属性中的name来确定匹配的路由,通过params来传递参数。
  1. this.$router.push({
  2. name: 'Describe',
  3. params: {
  4. id: id
  5. }
  6. })
  1. this.$route.params.id
  2.  
  3. 父组件:使用path来匹配路由,然后通过query来传递参数
    这种情况下 query传递的参数会显示在url后面?id=?
  1. this.$router.push({
  2. path: '/describe',
  3. query: {
  4. id: id
  5. }
  6. })
  7.  
  8. 对应子组件: 这样来获取参数
  1. this.$route.query.id

vue 路由跳转传参的更多相关文章

  1. vue路由跳转传参的两种方法

    路由跳转: this.$router.push({ name: '工单列表', params: {p_camera_dev_name: 'xxx'} }); 使二级菜单呈点击状态: $('[index ...

  2. vue路由跳转传参

    this.$router.push({ path: '/message/result_notice', query: { id: id } }) // let type = this.$route.n ...

  3. vue路由(一个包含重定向、嵌套路由、懒加载的main.js如下)and 路由跳转传参的query和params的异同

    import Vue from 'vue'import VueRouter from 'vue-router'import App from './App'Vue.use(VueRouter)cons ...

  4. vue 页面跳转传参

    页面之间的跳转传参,正常前端js里写 window.location.href="xxxxx?id=1" 就可以了: 但是vue不一样 需要操作的是路由history,需要用到 V ...

  5. Vue ---- 组件文件分析 组件生命周期钩子 路由 跳转 传参

    目录 Vue组件文件微微细剖 Vue组件生命周期钩子 Vue路由 1.touter下的index.js 2.路由重定向 3.路由传参数 补充:全局样式导入 路由跳转 1. router-view标签 ...

  6. Vue之路由跳转 传参 aixos 和cookie

    一.路由跳转 1.1 项目的初始化 vue create m-proj   >>>创建vue项目 精简vue项目的 views 视图   About(基本是删除的) Home.(可以 ...

  7. vue 中 this.$router.push() 路由跳转传参 及 参数接收的方法

    传递参数的方法:1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用name ...

  8. vue 路由跳转带参 方式query ,params

    a.vue向b.vue传值 a.vue this.$router.push({ path: '/payType', query: { putUpList: this.putUpList, name:' ...

  9. vue路由跳转传参数

    1. router-link <router-link :to="{ path: 'yourPath', params: { name: 'name', dataObj: data } ...

随机推荐

  1. Javascript如何实现继承?

    前言 我这篇文章会误人子弟,我把继承跟构造函数实例化搞混了,汗!要想搞清楚JS的继承机制,看下大牛写的文章:http://www.cnblogs.com/dolphinX/p/3307903.html ...

  2. pg 学习资料

    文/谭峰 DBA,PostgreSQL专家 开源数据库 PostgreSQL 中文资料非常缺乏,很多社区朋友苦于上手的中文资料少,因此汇总收集以下 PostgreSQL 中文资料,包括 Postgre ...

  3. jq 轮播图 上下自动滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. volatile非原子性的示例

    volatile非原子性的示例 package com.stono.thread2.page124; public class MyThread extends Thread { volatile p ...

  5. ios最新设置状态栏字体颜色总结

    状态栏的字体为黑色:UIStatusBarStyleDefault 状态栏的字体为白色:UIStatusBarStyleLightContent 一.在info.plist中,将View contro ...

  6. 设置用root用户telnet到linux系统

    默认情况下,ROOT用户不能以telnet方式连接Linux操作系统,而且也是不安全的.但从技术上来讲,是可以实现的. #mv /etc/securetty /etc/securetty.bak 保存 ...

  7. 如何更改iTunes备份地址(修改iphone ipad 备份地址) itunes文件目录修改方法 【亲测有效,附带原理说明】

    前言 C盘空间有限,但是iTunes就是那么龌龊,只能把手机备份存到C盘.那么怎么才能把备份文件存到其他分区的文件夹里面呢? 当时我想先看看度娘,看看有没有现成的! 结果 nnd!! 我看了一大堆相关 ...

  8. 回调函数实现类似QT中信号机制(最简单)

    1. 定义回调接口类: class UIcallBack{public: virtual void onAppActivated() = 0; virtual void onShowMore() = ...

  9. Google android source code build 问题总结【转】

    本文转载自:http://light3moon.com/2015/01/31/Google%20android%20source%20code%20build%20%E9%97%AE%E9%A2%98 ...

  10. bzoj4034 [HAOI2015]树上操作——树链剖分

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4034 树剖裸题: 一定要注意 long long !!! update 的时候别忘了 pus ...