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
          }
        }
      })
    }
  }
}
相关推荐
天天进步20153 分钟前
Webpack到Vite:构建工具迁移实战经验总结
前端·webpack·node.js
0***144 分钟前
免费的WebAssembly模块打包,Webpack配置
前端·webpack·wasm
小胖学前端4 分钟前
解决 uniapp H5 与原生应用通信的坑:一个经过实战验证的解决方案
前端·uni-app
LaoZhangAI5 分钟前
Gemini 2.5 Flash Image API尺寸设置完整指南:10种宽高比详解
前端·后端
kangyouwei7 分钟前
鸿蒙开发:19-本地开发配置bash环境执行hvigorw命令
前端·harmonyos
Achieve前端实验室10 分钟前
JavaScript 原型/原型链
前端·javascript
一碗下酒菜13 分钟前
React 闭包陷阱详解
前端
littleplayer13 分钟前
ArkTs单元测试 UnitTest 指南
前端
LXA080915 分钟前
vue3开发使用框架推荐
前端·javascript·vue.js
拿不拿铁1934 分钟前
Vite & Webpack & Rollup 入口与产出配置与示例
前端