1.问题:

使用params方式传参时(参数不显示的方式)

获取参数时,参数undefined

2.解决:

push时请使用name,不要使用path(路由的params对象使用,必须通过路由名name来调用路由)

this.$router.push({
   name: 'test',
params: {
    id: 1
   }
})

接收参数

this.$route.params.id

3.注意:

  • params传参,页面刷新后参数失效;
  • query传参,页面刷新后参数不会失效,参数被拼接在url

结束

vue路由params传参时出现undefined的更多相关文章

  1. vue路由组件传参

    在组件中使用 $route 会使之与其对应路由形成高度耦合,从而使组件只能在某些特定的 URL 上使用,限制了其灵活性. 使用 props 将组件和路由解耦: 取代与 $route 的耦合 const ...

  2. vue 路由动态传参 (多个)

    动态传参 传值页面  客户列表clientList.vue 路由 router.js 配置路由 接收参数的页面  客户详情CustomerDetails.vue 通过this.$router.para ...

  3. vue 路由 URL传参

    源码如下: import Vue from 'vue' import VueRouter from 'vue-router' Vue.use(VueRouter) //全局使用该组件 const ro ...

  4. Vue路由query传参

    1.不要进行过深的嵌套 let id = 'uyu' this.$router.push({ path: '/mrp_detail', query: { re_order_id: id, option ...

  5. axios 的 get 方法 params 传参 400 的问题

    axios 的 get 方法 params 传参,在输入框中输入某些特殊字符 例如中括号,请求时会直接报 400 错误,Bad Request. 原因:axios 的 get 方法,在使用 param ...

  6. vue刷新子页面,跳到主页,params传参引起的血案!

    今天,算是真正认识了params传参,为什么说params传参引起了血案? 起因是这样的,我正在做一个登陆的模块,公司想根据url不同的参数来区分是什么类型的会议, 于是后端推荐我用params传参的 ...

  7. vue query或params传参

    1.query 传递端: this.$router.push({ path:"/AccountFP", query:{ id:row.id, userId:row.userId } ...

  8. vue router使用query和params传参的使用

    传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,希望可以帮到大家. Vue ...

  9. Vue学习之路由vue-router传参及嵌套小结(十)

    一.路由传递参数: 1.使用query传值: <!DOCTYPE html> <html lang="en"> <head> <meta ...

  10. vue-router query和params传参(接收参数)$router $route的区别

    今天做项目时踩到了vue-router传参的坑(query和params),所以决定总结一下二者的区别. 直接总结干货!!! 1.query方式传参和接收参数 传参: this.$router.pus ...

随机推荐

  1. tmux中的vim无法多彩高亮显示关键字

    1. 问题描述 vim安装了interastingwords插件,在mobaxterm中的session可以正常显示多彩关键字,但是使用tmux登录session,只能显示两个颜色 2. 解决办法 这 ...

  2. HElib

    什么是HElib? HElib是一个基于C++语言的同态加密开源软件库,底层依赖于NTL数论运算库和GMP多精度运算库实现,主要开发者为IBM的Halevi,目前最新版本为1.0.2,实现了支持&qu ...

  3. ctfshow 红包题第七弹 .git

    .git源码泄露 发现有后们 flag在上级目录里面 直接Letmein=show_source('../flag.txt');就出来了

  4. 【异步编程实战】如何实现超时功能(以CompletableFuture为例)

    [异步编程实战]如何实现超时功能(以CompletableFuture为例) 由于网络波动或者连接节点下线等种种问题,对于大多数网络异步任务的执行通常会进行超时限制,在异步编程中是一个常见的问题.本文 ...

  5. Github 访问失败,问题修复

    参考学习链接: https://www.cnblogs.com/MuQuanyu-YuGod/articles/12549766.html Github 网站无法访问的解决方法: 解决方案: Cd到文 ...

  6. ABB机器人IO板DSQC651维修检查方法

    ABB机器人作为工业自动化的重要设备,其稳定性和可靠性对于生产线的持续运行至关重要.然而,在实际使用中,由于各种原因,可能会出现ABB机器人IO板DSQC651故障,影响机器人的正常运行. 一.ABB ...

  7. 附039.Kubernetes_v1.32.2高可用部署架构二

    部署组件 该 Kubernetes 部署过程中,对于部署环节,涉及多个组件,主要有 kubeadm .kubelet .kubectl. kubeadm介绍 Kubeadm 为构建 Kubernete ...

  8. Linux - 开启FTP服务

    vsftpd 一.Centos6.x配置ftp 1.1.安装OpenSSH-server OpenSSH-server包含了FTP服务,通常,CentOS6.x默认已经安装了OpenSSH-serve ...

  9. 普通文本(.txt)篇章排版样式参考 [文档说明][日志]

    把普通文本的篇章排版样式归总一下,供自己参考,当然如果读者能以此借鉴并学习到一些东西,是笔者最大的鼓励. 日志类 [1] 头标 [时间日期][备注][属性]内容 [2] [文件信息][符号][文件信息 ...

  10. 记录:tinyrenderer---1.2 Rasterizing the boundary

    光栅化三角形 Scanline rendering(扫描线渲染),一个老式的算法 按y轴坐标进行排序,我这里采取降序,ay > by > cy 同时光栅化三角形的左右两边 绘制水平线段,连 ...