微信小程序带参数分享界面、打开界面加载分享内容

分享功能是微信小程序常用功能之一,带参分享和加载可以让分享对象打开界面时看到和分享内容。

带参分享

用户点击微信小程序右上角自带分享,或者点击自定义分享按钮进行分享时,可在onShareAppMessage函数定义分享行为。

分享界面路径可带参,可在路径后加?,然后加上带的参数,一般格式为[参数名]=[参数值],需注意的是,参数值需为string,如果你的参数是对象类型,可以通过JSON.stringify转为string,后续可通过JSON.parse转回对象类型。

javascript 复制代码
  onShareAppMessage() {
    var card_info = {
      info1: this.data.info1,
      info2: this.data.info2,
    }
    var card_string = JSON.stringify(card_info)
    return{
      path: '/pages/ex-card/ex-card?card_string='+card_string
    }    
  },

需注意的是,自定义分享按钮open-type需设为"share":

html 复制代码
<button type="primary" plain size="mini" open-type="share" style="position: absolute;right:0;font-size:small;margin-right: 10rpx;">分享</button>

带参加载界面

在onLoad函数定义加载行为:

判断加载时是否带参,带参时使用参数加载,不带参使用默认值加载。

javascript 复制代码
  onLoad(options) {
    var page = getCurrentPages()
    var current_page = page[page.length-1]
    if(Object.keys(current_page.options).length>0)
    {
      var card_options = JSON.parse(current_page.options.card_string)
      this.setData({
        info1:card_options.info1,
        info2: card_options.info2
      })     
    }
  },

更多微信小程序内容欢迎关注、评论、私信博主。

相关推荐
DsirNg9 小时前
页面栈溢出问题修复总结
前端·微信小程序
小徐_23339 小时前
uni-app 也能远程调试?使用 PageSpy 打开调试的新大门!
前端·微信小程序·uni-app
小小王app小程序开发9 小时前
场馆预约小程序留存率提升指南:技术落地与运营实操全解析
小程序
深红11 小时前
玩转小程序AR-实战篇
前端·微信小程序·webvr
00后程序员张13 小时前
HTTPS Everywhere 时代的抓包挑战,从加密流量解析到底层数据流捕获的全流程方案
网络协议·http·ios·小程序·https·uni-app·iphone
我命由我1234518 小时前
微信小程序 - scroll-view 的一些要点(scroll-view 需要设置滚动方向、scroll-view 需要设置高度)
开发语言·前端·javascript·微信小程序·小程序·前端框架·js
weixin_4721835419 小时前
微信小程序使用websocket
websocket·微信小程序·小程序
发财北19 小时前
线上交友APP怎么开发?
小程序
2501_9159214320 小时前
Bundle Id 创建与管理的工程化方法,一次团队多项目协作中的流程重构
服务器·ios·小程序·重构·https·uni-app·iphone
少云清20 小时前
【功能测试】4_小程序项目 _Ego微商小程序测试点分析
功能测试·小程序