美文网首页vue2.x
Vue组件间跳转以及传参

Vue组件间跳转以及传参

作者: WebGiser | 来源:发表于2018-12-10 17:20 被阅读1次

传递参数的方法:

1.Params

由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效。需要用name来指定页面,及通过路由配置的name属性访问。
在路由配置文件中定义参数:


image.png

通过name获取页面,传递params:


image.png

在目标页面通过this.$route.params获取参数:


image.png

2.Query

页面通过path和query传递参数,该实例中row为某行表格数据


image.png

在目标页面获取参数:

this.$route.query.row

相关文章

  • Vue组件间跳转以及传参

    传递参数的方法: 1.Params 由于动态路由也是传递params的,所以在 this.$router.push...

  • vue使用this.$bus+keep-alive解决组件间跳转

    vue使用this.$bus+keep-alive解决组件间跳转传参,参数无法保存问题 前言 这是我在最近工作中经...

  • SSM单体架构项目 (下)

    Vue 组件 组件导入 组件传参 props 组件传参,父组件向子组件传参 分页 引入分页组件

  • vue中组件3种编程式路由跳转传参

    路由传参 1、路由配置传参(刷新页面不会丢失参数,url会携带参数) A组件跳转B组件传参A组件 路由配置 B组件...

  • Vue组件间数据传递

    前言 总结vue组件间的数据传递 路由传参 父组件传递数据给子组件---props 子组件传递数据给父组件---$...

  • react native 页面跳转传参

    react native 组件之间传参包括父传子和子传父,但是也有页面跳转时需要传参,比如从A页面跳转到B页面...

  • Vue实战第二天

    路由组件传参 动态路由传参 静态路由传参 函数传参htm5 history 模式 设置通用路由,找不到页面跳转自定...

  • Vue组件间的传参½

    一、props与$emit 组件间的通信 、原则上可以实现所有组件见的参数传递父 => 子 子 => 父 二、事...

  • vue组件之间通信

    vue父组件给子组件传参使用props子组件给父组件传参使用时间派发$dispatch兄弟组件之间传递参数使用vuex

  • 06.父子组件 (VUE全栈开发学习笔记)

    以下,节选自08.Vue传值方式 3.父子组件传参 使用场景:父子组件间 3.1. 父传子 子组件定义属性: 父组...

网友评论

    本文标题:Vue组件间跳转以及传参

    本文链接:https://www.haomeiwen.com/subject/imddhqtx.html