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
          }
        }
      })
    }
  }
}
相关推荐
GISer_Jing6 分钟前
前端学习总结——AI&主流前沿方向篇
前端·人工智能·学习
渣哥15 分钟前
用错注入方式?你的代码可能早就埋下隐患
javascript·后端·面试
尘世中一位迷途小书童16 分钟前
Monorepo 工具大比拼:为什么我最终选择了 pnpm + Turborepo?
前端·架构
一枚前端小能手18 分钟前
🔍 重写vue之ref和reactive
前端·javascript·vue.js
星链引擎20 分钟前
4sapi.com开发者进阶版(技术导向,侧重 “原理 + 最佳实践”)
前端
尘世中一位迷途小书童22 分钟前
2025年了,你还在用传统的多仓库管理吗?Monorepo 架构深度解析
前端·架构
fruge24 分钟前
前端性能优化实践指南:从理论到落地
前端·性能优化
快起来别睡了29 分钟前
用这 9 个 API,我把页面性能干到了 90+
前端
芒果茶叶40 分钟前
深入浅出requestAnimationFrame
前端·javascript·html
歪歪10043 分钟前
在哪些场景下适合使用 v-model 机制?
服务器·前端·javascript·servlet·前端框架·js