uniapp路由传参存在数据类型失真的问题

javascript 复制代码
export default {
  methods: {
    jump() {
      // 通过params传参
      this.$Router.push({name: 'demo', params: {
      	number:1,
        name: '123',
        value: null
      }})
    }
  }
}

目标模块接收参数:

javascript 复制代码
export default {
  onLoad() {
    // 获取参数
    const {number,name, value} = this.$Route.query
    console.log(number,name,value) // '1', '123', 'undefined'
  }
}

这时发现,目标模块接收到的参数都会变成字符串类型,并且null值会变成字符串的undefined;

解决以上问题,可以将传递的参数构造成一个嵌套对象,如用一个data属性来装填我们的参数:

javascript 复制代码
export default {
  methods: {
    jump() {
      // 通过params传参
      this.$Router.push({
        name: 'demo', 
        params: {
          data: {
            number:1,
        	name: '123',
        	value: null
          }
        }
      })
    }
  }
}
相关推荐
之歆几秒前
Day03_HTML 列表、表格、表单完整指南(下)
android·javascript·html
焦糖玛奇朵婷3 分钟前
解锁扭蛋机小程序的五大优势
java·大数据·服务器·前端·小程序
SwJieJie13 分钟前
windsurf的配置和项目规则、工作流、agent技巧使用
前端
白日梦想家68122 分钟前
从基础入手,分清一次性定时器与永久定时器
前端
李白的天不白23 分钟前
读到数据为undefind是的几种情况
开发语言·javascript·ecmascript
AIwork4me38 分钟前
别再把 RAG 当知识库:用 AutoClaw 搭一套会进化的 Karpathy LLM Wiki
前端
彩票管理中心秘书长1 小时前
Git 归档与补丁命令大全(完整详解版)
前端
RePeaT1 小时前
【Nginx】前端项目部署与反向代理实战指南
前端·nginx
索木木2 小时前
ShortCut MoE模型分析
前端·html
MXN_小南学前端2 小时前
Vue3 + Spring Boot 工单系统实战:用户反馈和客服处理的完整闭环(提供gitHub仓库地址)
前端·javascript·spring boot·后端·开源·github