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
          }
        }
      })
    }
  }
}
相关推荐
千里马-horse9 分钟前
TypedArrayOf
开发语言·javascript·c++·node.js·napi
小笔学长17 分钟前
Webpack 配置优化:提高打包速度与质量
前端·项目实战·前端开发·webpack优化·打包性能优化
Hao_Harrision22 分钟前
50天50个小项目 (React19 + Tailwindcss V4) ✨| NotesApp(便签笔记组件)
javascript
优爱蛋白25 分钟前
SCF His Tag 重组蛋白:c-Kit受体信号研究与干细胞培养应用的关键试剂
前端·人工智能·健康医疗
C_心欲无痕31 分钟前
react - Suspense异步加载组件
前端·react.js·前端框架
JosieBook38 分钟前
【Vue】05 Vue技术——Vue 数据绑定的两种方式:单向绑定、双向绑定
前端·javascript·vue.js
前端小L1 小时前
贪心算法专题(十五):借位与填充的智慧——「单调递增的数字」
javascript·算法·贪心算法
想学后端的前端工程师1 小时前
【浏览器工作原理与性能优化指南:深入理解Web性能】
前端·性能优化
Aliex_git1 小时前
内存堆栈分析笔记
开发语言·javascript·笔记
程序员爱钓鱼1 小时前
Node.js 编程实战:错误处理与安全防护
前端·后端·node.js