Vue 有时在路由跳转时需要用到一些原页面里的数据,用以下方法:

1、在跳转页的方法里写下query参数

TableChange(scope){
this.$router.push({
path:'details',
name:'details',
query:{ //需要携带的参数
projectId:this.projectId,
projectName:this.projectName,
linkMan:this.linkMan,
phone:this.phone,
address:this.address,
builders:this.builders
}
})
},

2、在目标页读取使用:

this.$route.query

即可读取到传递过来的参数

Vue编程式路由跳转传递参数的更多相关文章

  1. vue编程式路由实现新窗口打开

    一. 标签实现新窗口打开: 官方文档中说 v-link 指令被 组件指令替代,且 不支持 target=”_blank” 属性,如果需要打开一个新窗口必须要用标签,但事实上vue2版本的 是支持 ta ...

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

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

  3. vue编程式导航,命名路由

    //使用 window.location.href 的形式,叫做 编程式导航 绑定事件的形式 <template> <div class="goods-item" ...

  4. vue.js编程式路由导航 --- 由浅入深

    编程式路由导航 实例中定义一个方法,这个方法绑定在标签上 然后就设置路由跳转 语法 this.$router.history.push('要跳转路由的地址') <!DOCTYPE html> ...

  5. VueJs(10)---vue-router(动态路由,嵌套式路由,编程式路由)

    vue-router(动态路由,嵌套式路由,编程式路由) 本文是基于官网学习,官网具体学习目录:vue-router 一.安装 基于vue-cli脚手架安装还是蛮简单的:在文件当前目录下运行: npm ...

  6. 在React中使用 react-router-dom 编程式路由导航的正确姿势【含V5.x、V6.x】

    ## react-router-dom 编程式路由导航 (v5) ###### 1.push跳转+携带params参数 ```jsx props.history.push(`/b/child1/${i ...

  7. 解决vue单页路由跳转后scrollTop的问题

    作为vue的初级使用者,在开发过程中遇到的坑太多了.在看页面的时候发现了页面滚动的问题,当一个页面滚动了,点击页面上的路由调到下一个页面时,跳转后的页面也是滚动的,滚动条并不是在页面的顶部 在我们写路 ...

  8. SpringMVC 解析(四)编程式路由

    多数情况下,我们在使用Spring的Controller时,会使用@RequestMapping的形式把请求按照URL路由到指定方法上.Spring还提供了一种编程的方式去实现请求和路由方法之间的路由 ...

  9. vue 路由 及 跳转传递参数的总结

    博客地址:https://ainyi.com/4 vue-router vue-router 是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基 ...

随机推荐

  1. vue :src 不显示的解决方案

    一定要将静态资源引入 [ require("@/assets/") ],绑定到 模型绑定的:src 数据中 动态的数据才能有效   <template>   <d ...

  2. prepareRefresh方法源码跟踪

    看这篇文章之前可以先了解之前的跟踪流程,https://www.jianshu.com/p/4934233f0ead 代码过宽,可以shift + 鼠标滚轮 左右滑动查看 AbstractApplic ...

  3. 微信小程序语音(A)发给别人(B),也能播放,是需要先把语音上传到自己的服务器上才可以

    小程序语音(A)发给别人(B),也能播放,是需要先把语音上传到自己的服务器上才可以. https://developers.weixin.qq.com/miniprogram/dev/api/medi ...

  4. tools.windows.bat#批处理

    关于%~ %~I - 删除任何引号("),扩展 %I %~fI - 将 %I 扩展到一个完全合格的路径名 %~dI - 仅将 %I 扩展到一个驱动器号 %~pI - 仅将 %I 扩展到一个路 ...

  5. [PHP] php作为websocket的客户端实时读取推送日志文件

    首先要使用composer来下载一个第三方扩展就可以实现php的websocket客户端,直接在当前目录生成下composer.json文件就可以了composer require textalk/w ...

  6. List<Object> 查询解析优化

    2018年3月16日 大型仪器设备分类查出后,需要展示个分类下总共有多少台设备.因为分类总共分三层,加起来数据700+.以后该系统上线设备可能达到2000+,这样统计每个分类下的设备可能会拖垮服务器. ...

  7. Netty 模型

    Demo代码 使用Maven的话请在pom.xml中注入netty依赖 <!-- https://mvnrepository.com/artifact/io.netty/netty-all -- ...

  8. Redis 详解 (四) redis的底层数据结构

    目录 1.演示数据类型的实现 2.简单动态字符串 3.链表 4.字典 5.跳跃表 6.整数集合 7.压缩列表 8.总结 上一篇博客我们介绍了 redis的五大数据类型详细用法,但是在 Redis 中, ...

  9. [LeetCode] 933. Number of Recent Calls 最近的调用次数

    Write a class RecentCounter to count recent requests. It has only one method: ping(int t), where t r ...

  10. [LeetCode] 928. Minimize Malware Spread II 最大程度上减少恶意软件的传播之二

    (This problem is the same as Minimize Malware Spread, with the differences bolded.) In a network of ...