1 this.$router.push({
2 // name:路由组件名
3 name: routeName,
4 query: {
5 mapId:this.mapId
6 }
7 })
8
9 this.$router.push({
10 name: routeName,
11 params: {
12 mapId:this.mapId
13 }
14 })
15
16 // query:参数会拼接在url上;params:参数不会直接拼接在请求体上
17
18 // 获取路由参数如下:
19 this.$route.query.mapId
20 this.$route.params.mapId
21
22
23 // 监听路由如下:
24 watch: {
25 $route: {
26 handler(val) {
27 // 逻辑操作
28 }
29 }
30 }

跳转路由传参如下:

获取路由参数如下:

监听路由如下:

Vue2路由跳转传参,获取路由参数,Vue监听路由的更多相关文章

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

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

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

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

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

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

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

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

  5. vue 路由跳转传参

    <li v-for="article in articles" @click="getDescribe(article.id)"> getDescr ...

  6. vue监听路由的变化,跳转到同一个页面时,Url改变但视图未重新加载问题

    引入:https://q.cnblogs.com/q/88214/ 解决方法: 添加路由监听,路由改变时执行监听方法 methods:{ fetchData(){ console.log('路由发送变 ...

  7. vue 监听路由变化

    方法一:通过 watch // 监听,当路由发生变化的时候执行 watch:{ $route(to,from){ console.log(to.path); } }, 或 // 监听,当路由发生变化的 ...

  8. vue监听路由变化

    使用 watch,观察路由,一旦发生变化便重新获取数据 watch: { // 如果路由有变化,会再次执行该方法 '$route': 'fetchData' }

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

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

  10. router.push query 路由 跳转 传参使用

    this.$router.push({path:'/shop',query:{ goods_name:goods_name, goods_price:goods_price, uid:goods_pr ...

随机推荐

  1. python38

    Python break 语句 Python break语句,就像在C语言中,打破了最小封闭for或while循环. break语句用来终止循环语句,即循环条件没有False条件或者序列还没被完全递归 ...

  2. 【git】2.4 撤销操作

    资料来源 (1) https://git-scm.com/book/zh/v2/Git-%E5%9F%BA%E7%A1%80-%E6%92%A4%E6%B6%88%E6%93%8D%E4%BD%9C ...

  3. swing01

    基于Eclipse和Mysql 快捷键: 类的备注:/** +enter main方法快捷方式:main alt+/ 自动提示:alt+/ 提示报错:ctrl+1 输出语句快捷方式:syso alt+ ...

  4. [*]Quadratic Residual Networks: A New Class of Neural Networks for Solving Forward and Inverse Problems in Physics Involving PDEs

    Accepted by SIAM International Conference on Data Mining (SDM21) 本文提出了二次残差网络,通过在应用激活函数之前,添加二次残差项到输入的 ...

  5. 使用@RequestBody注解接收的实体类中的某些参数为null

    原因 postman调试接口 为null的参数命名不符合"驼峰法",类似实体类A的属性 cEnterpriseId ,这种命名是不规范的 和lombook的@Data注解有关 用p ...

  6. 我和Java这些年的故事(五)

    时光荏苒,我来到了IBM.和慕名已久的WebSphere Application Server(WAS)打起了交道. 之前我搞过Weblogic,对应用服务器的特性有了一定的了解.但WAS无疑更为庞大 ...

  7. vim超级替换

    vim实现变量替换, 检测代码中#0-F0-FH替换为0x0-F0-F,例如#09FH替换为0x09F :%s/#\(\w\)\(\w\)\(\w\)H/0x\1\2\3/g 注: 标准格式 :s/p ...

  8. git通过ssh方式免密克隆代码仓库

    git上添加ssh公钥 略过 终端命令行 格式: git clone ssh://[user@]host.xz[:port]/path/to/repo.git/ 栗子: git clone ssh:/ ...

  9. Spring Security 自定义认证逻辑

    Spring Security 自定义认证逻辑 这篇文章的内容基于对Spring Security 认证流程的理解,如果你不了解,可以读一下这篇文章:Spring Security 认证流程 . 分析 ...

  10. golang中自带base64编码和解码

    package main import ( "encoding/base64" "fmt" "log" ) func main() { in ...