E企盈营销工具技术服务商 热线:4006-838-530

微信小程序实现分享功能

E企盈直播平台营销卖货系统

本篇文章的目标是实现分享小程序中的单张页面给其他用户,并且打开分享后的页面拥有返回按钮.  最终的效果:                                                               1. 封装一个分享的组件<view class=’share’>   <view class=’like’>      <view class=’iconfont icon-aixin’></view>   </view>   <view class=’weixin’>       <button open-type=”share” class=’iconfont icon-weixin’></button>   </view></view>页面效果如下:                                            说明:   如果想在页面上实现点击按钮分享,那么这个点击的按钮必须使用button标签,并且open-type置为share 2.在想要分享的页面中引入上面组件,并在页面的js中Page所包含的对象里增加一个方法onShareAppMessage Page({  /**   * 页面的初始数据   */  data: {   news_id:12  },  /**   * 生命周期函数–监听页面加载   */  onLoad: function (options) {             },  /**   * 用户点击右上角分享   */  onShareAppMessage: function () {    let url = encodeURIComponent(‘/packageNews/pages/news_detail/news_detail?news_id=’ + this.data.news_id);    return {      title: “热点详情”,      path:`/pages/index/index?url=${url}`     }  }}) 说明:  将当前页面的路径包括参数使用encodeURIComponent进行编码并作为url的参数,path设置为小程序的首页.当我们将该页面分享给其他人时,他们打开的首先是首页,然后跳转到我们分享的这个页面. 3.要想分享后的页面打开先进入首页再跳转到分享的页面,首页的js要做如下设置 //index.jsPage({  data: {    },  onLoad: function (options) {    if(options.url){      let url = decodeURIComponent(options.url);      wx.navigateTo({        url      })    }  }})说明:  在onLoad的方法中先判断有没有url参数,如果有的话就使用decodeURIComponent对url解码然后跳转.由于小程序是先进入了首页然后跳转到分享页,这样便解决了分享页没有返回键的问题.

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » 微信小程序实现分享功能
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏