微信小程序(学习三) -- 区分分享到个人或者分享到群

原创 2018年04月17日 17:00:38

假如我们的微信小程序有一个对战功能,对战是需要观战的,我们需要将分享发送到群,发送到个人是无效的,这个时候我们就需要在程序内知道用户是分享到个人的还是分享到群。
效果如下:
这里写图片描述

实现:

<!--index.wxml-->
<view class="container">
  <view class='question'>
    <text style='color:white'>{{msg}}</text>
    <button open-type='share'>分享</button>
  </view>
</view>
// pages/fight/share.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    msg: "",
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    wx.showShareMenu({
      withShareTicket: true
    })
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function (options) {
    var that = this;
    return {
      title: '我已经通过了26关了,你能通过多少关',
      path: '/pages/fight/index',
      imageUrl: '/images/lobby/bg_musicguess.png',
      success: function(options) {
        if (options.shareTickets) {
          wx.showToast({
            title: '已经分享到群',
          });
        } else {
          wx.showToast({
            title: '请分享到群',
          });
        }
      },
      fail: function (options) {
        that.setData({
          msg: JSON.stringify(options)
        });
      }
    }
  },
})

onShareAppMessage(options)

在 Page 中定义 onShareAppMessage 函数,设置该页面的转发信息。

  1. 只有定义了此事件处理函数,右上角菜单才会显示 “转发” 按钮
  2. 用户点击转发按钮的时候会调用
  3. 此事件需要 return 一个 Object,用于自定义转发内容

options 参数说明

参数 类型 说明
from String 转发事件来源。button:页面内转发按钮;menu:右上角转发菜单
target Object 如果 from 值是 button,则 target 是触发这次转发事件的 button,否则为 undefined

自定义转发字段

字段 说明 默认值
title 转发标题 当前小程序名称
path 转发路径 当前页面 path ,必须是以 / 开头的完整路径
imageUrl 自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,支持PNG及JPG,不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
success 转发成功的回调函数
fail 转发失败的回调函数
complete 转发结束的回调函数(转发成功、失败都会执行

只有转发到群,才有shareTickets参数,同时通过shareTickets我们可以知道是转发到群还是个人。

版权声明:阳仔原创,转载请注明出处。 https://blog.csdn.net/honey199396/article/details/79977453

微信小程序-分享页面到微信群或者好友携带分享者身份信息

原文链接:http://www.smallerpig.com/1202.html?utm_source=tuicool&utm_medium=referral当用户在群聊中点击小程序的分享卡片,开发者...
  • wtdask
  • wtdask
  • 2017-06-27 10:47:36
  • 11261

微信群抢小程序分享的红包

 最近项目上线了一个小程序抢红包的迭代,其实小程序是目前是没有开放这个接口的,抢红包接口目前只对公众号开放,怎么实现的是不是大家很好奇呢?首先,我们先来分析小程序抢红包功能的使用场景,在小程序里面微信...
  • illusion_you
  • illusion_you
  • 2018-02-08 10:58:08
  • 200

微信小程序 分享功能(十)

wx.showActionSheet
  • chenna1102cn
  • chenna1102cn
  • 2017-07-18 15:21:47
  • 5288

如何识别小程序转发是转发到群还是转发到好友?

如何识别小程序转发是转发到群还是转发到好友? onShow: function () { wx.showShareMenu({ //这里是为了分享群可以获取群信息,比如sha...
  • Gochan_Tao
  • Gochan_Tao
  • 2018-03-23 20:19:47
  • 93

微信小程序 分享功能

1、分享 可以分享小程序的任何一个页面给好友或群聊。注意是分享给好友或群聊,并没有分享到朋友圈。一方面微信在尝试流量分发方式,但同时又不愿意开放最大的流量入口。 开发文档:https://...
  • yelin042
  • yelin042
  • 2018-01-10 13:52:56
  • 4426

小程序web-view分享html5网页,h5网页通过webview分享到微信群——微信web-view高级用法14

微信小程序一个重要的功能, 就是能够把小程序中的页面, 分享到微信群或者微信好友。 其实我们网站的h5页面, 在小程序里显示后, 也可以实现上面的分享功能。 只要使用小...
  • towtotow
  • towtotow
  • 2018-02-04 12:59:18
  • 425

微信小程序开发之页面分享 onShareAppMessage 分享参数用处

今天下午突然听到群里有人说微信小程序工具更新了,文档也更新了不少内容. 顾不上吃冬至的饺子.我就冲进来了. 先说分享功能,目前真机尚不能调试.开发工具上可以看看效果.后续还会更新. Page()...
  • qq_31383345
  • qq_31383345
  • 2016-12-21 21:28:01
  • 55401

开发文档:移动应用支持微信小程序类型分享(Android应用)

昨天,第九程序为大家介绍了关于移动app可分享小程序页面的ios应用文档(点击ios应用查看),今天带来的是关于Android应用开发文档,需要的请注意查收!...
  • qq_38125123
  • qq_38125123
  • 2017-03-31 13:55:43
  • 2325

微信小程序开发关于分享功能中怎么定义同一个页面中不同的按钮触发不同的分享内容,或者右上角的分享和页面中分享

微信小程序分享中分为点击右上角的分享和点击按键(即是button组件)的分享.而不同按键的分享可以通过id属性来区分,具体实现如下:.js页面中代码 //分享功能 onShareAppMe...
  • weixin_37281289
  • weixin_37281289
  • 2018-02-09 15:26:12
  • 435

微信小程序分享页面

解决微信小程序分享页面到朋友圈
  • KKKun_Joe
  • KKKun_Joe
  • 2017-09-26 14:17:41
  • 4015
收藏助手
不良信息举报
您举报文章:微信小程序(学习三) -- 区分分享到个人或者分享到群
举报原因:
原因补充:

(最多只允许输入30个字)