微信小程序之分享当前页面截图给微信好友

2022-05-30 14:02:41 阅读：190 来源： 互联网

标签：截图微信 Share miniprogram https 分享 pages 页面

参考链接：https://blog.csdn.net/qq_39410252/article/details/121278343

效果图：

实现步骤：

1. 建一个微信小程序项目

2. 将其路径添加进app.json

  "pages": [
    "pages/Share/Share"
  ],

3. 在Share.wxml中添加一个button

<!--miniprogram/pages/Share/Share.wxml-->
<text>miniprogram/pages/Share/Share.wxml</text>
<button type="default" open-type="share" class="clear-style">分享给好友</button>

4. 在Share.wxss中为button设置样式

/* miniprogram/pages/Share/Share.wxss */
.clear-style{
  border: none;
  border-radius: 0;
  background-color: transparent !important;
  padding: 0rpx !important;
  margin: 0rpx !important;
  text-align: left;
  height: 140rpx;
}

.clear-style::after{
  border: none;
}

5. 在Share.js中更新分享按钮触发函数

查看分享函数各参数意义：https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html#onShareAppMessage-Object-object

  /**
   * Called when user click on the top right corner to share
   */
  onShareAppMessage: function () {
    return {
      title: '邀请您使用XXX小程序',
      path: '/pages/show/show', // 当对方点击你分享的小程序时到达的页面
      imageUrl: 'https://img1.baidu.com/it/u=4049022245,514596079&fm=253&fmt=auto&app=120&f=JPEG?w=889&h=500'  //转发时显示此图片，若没有此参数，默认是传送当前页面截图
    }

  }

上述效果图中是不带imageUrl时的效果。

标签：截图,微信,Share,miniprogram,https,分享,pages,页面
来源： https://www.cnblogs.com/smart-zihan/p/16326522.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

微信小程序之分享当前页面截图给微信好友