扫码普通二维码进入微信小程序（踩坑）

原创已于 2022-09-08 10:46:08 修改 · 705 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#微信小程序 #vue.js #小程序

于 2022-09-08 10:36:17 首次发布

该代码段展示了在App.vue的onLoad和onShow事件中如何获取并解析小程序中通过二维码携带的参数q。首先，通过decodeURIComponent解码参数，然后使用split和reduce方法将参数转换为对象形式进行存储。

在页面的`onLoad`获取参数

onLoad(args) {
    if (args.q !== undefined) {
      const q = decodeURIComponent(args.q)
      const querys = q
        .split('?')[1]
        .split('&')
        .reduce((acc, it) => {
          let r = it.split(/=/)
          return Object.assign(acc, {
            [r[0]]: r[1]
          })
        }, {})
    }
  },

在`App.vue`的`onShow`监听

在这里插入图片描述
扫普通二维码进入小程序固定携带参数q
在页面中使用：

const app = getApp()
const q = app.globalData.q
    if (q) {
      const querys = q
        .split('?')[1]
        .split('&')
        .reduce((acc, it) => {
          let r = it.split(/=/)
          return Object.assign(acc, {
            [r[0]]: r[1]
          })
        }, {})
    }