小程序onShareAppMessage

1、onShareAppMessage:监听用户点击右上角菜单的「转发」按钮时触发的事件

2、添加分享按钮及右上角的分享按钮,文字及图片内容更改,时两个转发出去的内容一样

示例
1、小程序转发的入口,为图片中的1,2 两个位置


微信图片_20200116154818.jpg
微信图片_20200116154826.jpg
/**
   * 用户点击右上角分享 .js文件
   */
  onShareAppMessage: function (res) {
//转发事件来源:button:页面内转发按钮;menu:右上角转发菜单
    if (res.from === 'button') {
      console.log("来自页面内转发按钮");
      console.log(res.target);
    }
    else {
      console.log("来自右上角转发菜单")
    }
    return {
      title: '标题',
      imageUrl: "/resources/images/role/share.jpg",//转发携带的图片,可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG
      path:"/pages/index/index",//当前页面 path ,必须是以 / 开头的完整路径
      success: (res) => {
        console.log("转发成功", res);
      },
      fail: (res) => {
        console.log("转发失败", res);
      }
    }
  },
//.wxml文件
<view class="share-box">
    <button class="share-btn" open-type="share">
      <image src="/resources/images/index/share.png" class="share-img"></image>
    </button>
  </view>


//.wxss文件
.share-box{
  position: fixed;
  top:12%;
  right: 6%;
}
.share-btn{
  width: 120rpx;
  height: 120rpx;  
  border-radius: 50%;
  background: transparent;
  border: red;
  box-shadow: 0 0 25rpx #F81945;
  
}
.share-img{
  width: 120rpx;
  height: 120rpx;
}
button{
  border: 0;
  padding: 0;
  margin: 0;
}


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 遇到的问题: 小程序不支持长按识别二维码 小程序不支持长按识别二维码,所以遇到产品要求要做成小程序页面但是需要长按...
    xurna阅读 3,998评论 0 1
  • 北京2018年4月1日上午,NBA常规赛勇士客战国王的比赛中,发生了令人痛心不已的一幕。比赛进行到第三节还有41...
    Curry_宇阅读 5,011评论 1 1
  • 1:js文件中,每个函数写完末尾必须有“,”号,不然会报错,最后一个函数不用“,” 2:修改了js文件的话,需要清...
    村长王无敌阅读 3,733评论 2 3
  • 写在前面 微信小程序出来也蛮久了,经过了市场的考验,已经站稳脚跟,融入到了各行各业,市场需求激增打来的是开发人员的...
    月梦佳期阅读 5,653评论 1 1
  • 也许太过幸福了,我少了太多自责。 变得很懒惰,坐享其成。 不用做饭洗碗的日子,我也没有抓紧时间多学习一些育儿知识,...
    卓子lonuo阅读 1,768评论 0 0