×

微信小程序转发的一些设置问题

作者:天空2018.08.03来源:Web前端之家浏览:840评论:0
微信公众号

微信公众号

微信小程序转发的一些设置问题。

小程序的转发功能已经封装好了,可以通过在 Page 中定义 onShareAppMessage 函数,设置该页面的转发信息。
wxml

<button open-type="share">转发</button>

JS

Page({
  onShareAppMessage: function (res) {
    return {
      title: '自定义转发标题',
      path: '/page/user?id=123',
      success: function(res) {
        // 转发成功
      },
      fail: function(res) {
        // 转发失败
      }
    }
  }
})

以上就是一个简单的转发按钮,触发后可以调用onShareAppMessage函数来进行转发,转发的小页面可以在函数中进行定义。
这些在官方文档中都有而且很详细,但是我在开发的时候还是遇到了一些问题,下面来进行一些总结。

1、辨别转发到个人还是群

在做小程序的时候,产品有个需求是要判别是否转发到群,针对群和个人进行不同的反馈。
想要获取到转发信息的话需要在js中写

wx.showShareMenu({  
    withShareTicket: true
})

开启了withShareTicket之后,如果转发在群里的话,在转发之后成功的回调函数中可以获取到shareTickets
shareTickets是一个数组,可以判断shareTickets的有无来判断是转发到群里还是个人

2、多个转发按钮

当一个页面中有多个转发的按钮的话,每个按钮的转发页面又有所不同的时候。就要在onShareAppMessage函数中进行单独的设置。
onShareAppMessage函数中有options 参数,options 参数里面有这触发该函数的来源
options 中的from参数表示转发事件来源。button:页面内转发按钮;menu:右上角转发菜单。
如果是button的话还可以通过button中的target参数来判断是哪一个button触发的,可以获取到button的id或者class。
这样就可以对不同的按钮来设置不同的转发页面
eg:

Page({
  onShareAppMessage: function (res) {
    //button触发
    if (res.from === 'button') { 
      let target_id = res.target.id;      //id为btn1的button触发
      if (target_id === "btn1") {        
      return {
          title: '转发一',
          path: '/page/index',
          success: function(res) {
            // 转发成功
          },
          fail: function(res) {
            // 转发失败
          }
        }      //id为btn2的button触发
      }else if((target_id === "btn2")){        return {
          title: '转发二',
          path: '/page/user',
          success: function(res) {
            // 转发成功
          },
          fail: function(res) {
            // 转发失败
          }
        }
      }    //menu触发
    }else if (res.from === 'menu') {        return {
          title: 'menu转发',
          path: '/page/user',
          success: function(res) {
            // 转发成功
          },
          fail: function(res) {
            // 转发失败
          }
        }
    }
  }
})

注:menu的转发要单独进行设置的

3、转发带参数

在转发的时候,如果需要在别的用户点击转发进入小程序的时候带有参数的话,可以通过在onShareAppMessage函数中带入所需的值,进行转发

Page({
  onShareAppMessage: function (res) {
    let sendinfo = {
      num: 1,
      nickName: "jack",
    }    
    let str = JSON.stringify(sendinfo);    
    return {
      title: nickName + '向你分享了小程序',
      path: '/page/user?sendinfo=' + sendinfo,
      success: function(res) {
        // 转发成功
      },
      fail: function(res) {
        // 转发失败
      }
    }
  }
})

现在点击这个转发卡片就后,在转发路径地址的页面中就可以获取到带入的值了。

Page({
  data:{
  }
  onLoad: function (option) {
    let sendinfo = option.sendinfo ;
  }
})
温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
http://jiangweishan.com/article/html123124214.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

  • 访客

    代码不可以用...

  • asidl

    这个DEMO应该再细点更好。。。...

  • 今天头条

    文章不错非常喜欢...

  • admin

    可以交换链接~...

  • 周松松博客

    确实不会用...

  • 便宜vps

    https://www.yd631.com/(便宜vps)申请交换链接,不知可否?联系邮箱:...

  • 访客

    我是里奥梅西,现在荒的一逼!!!...

  • qlong

    mailAutoComplete插件好用。...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2013-2018 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.5.2 Zero