web端分享扫码携参打开小程序并拿到参数渲染

前端从网站生成二维码带参数打开小程序

具体流程

每一道题目都是一个固定的ID，在网站点击某一个题目弹出一个二维码，扫描二维码，在小程序打开(前提是有小程序)

 share(){
        var that = this;
        $.ajax({
          url: '域名/wx/getwxacodeunlimit',
          type: "GET",
          data:{
            page:'pages/entry/entry', // 小程序页面路径
            scene:this.partId  // 所携带参数
          },
          responseType:'arraybuffer',
          success: function (res) {
             that.isCodeDialog = true;
             that.isDialogImg = '域名/wx/getwxacodeunlimitpage=pages%2Fentry%2Fentry&scene='+this.partId
             // 返回二维码地址绑定在src
             // %2F是斜杠(此处我之前不知道 一直用vue 踩坑)
          },
          error: function (error) {
          }
        })
      },

小程序的处理参考 https://developers.weixin.qq.com/miniprogram/dev/api/getWXACodeUnlimit.html

之前没做过小程序的看一下

onLoad里面只能有一个参数

// 这是小程序官方文档
Page({
  onLoad(query) {
    // scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
    const scene = decodeURIComponent(query.scene)
  }
})

onLoad: function (context) {
    console.log(context.sence) // 这个就是自定义编译里面参数sence
    var curEntryId; // 有这个Id就可以渲染数据
    if (context.sence){
      curEntryId = context.sence
    }else{
    // 之前小程序的代码（不用管）
      curEntryId = app.$store.getFromAppThenContext('curEntryId', context, {
        overrideState: true
      })
    }
}

原本以为会比较麻烦，但是没想到其实很简单