zoukankan      html  css  js  c++  java
  • 小程序分享链接功能

    onShareAppMessage用法:

    只需要在button标签中加入open-type="share",小程序ui就会自动识别分享链接功能

    <button data-name="shareBtn" open-type="share">分享</button>

    js中代码如下:

    onShareAppMessage: function( options ){
      var that = this;
      // 设置菜单中的转发按钮触发转发事件时的转发内容
      var shareObj = {
        title: "转发的标题",        // 默认是小程序的名称(可以写slogan等)
        path: '/pages/share/share',        // 默认是当前页面,必须是以‘/’开头的完整路径
        imageUrl: '',     //自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径,支持PNG及JPG,不传入 imageUrl 则使用默认截图。显示图片长宽比是 5:4
        success: function(res){
          // 转发成功之后的回调
          if(res.errMsg == 'shareAppMessage:ok'){
          }
        },
        fail: function(){
          // 转发失败之后的回调
          if(res.errMsg == 'shareAppMessage:fail cancel'){
            // 用户取消转发
          }else if(res.errMsg == 'shareAppMessage:fail'){
            // 转发失败,其中 detail message 为详细失败信息
          }
        },
        complete: fucntion(){
          // 转发结束之后的回调(转发成不成功都会执行)
        }
      };
      // 来自页面内的按钮的转发
      if( options.from == 'button' ){
        var eData = options.target.dataset;
        console.log( eData.id);     // shareBtn
        // 此处可以修改 shareObj 中的内容
        shareObj.path = '/pages/goods/goods?goodId='+eData.id;
      }
      // 返回shareObj
      return shareObj;
    }

    在实际应用中,会碰到这种情况:

    微信小程序分享时,需要调用一个ajax(Promise)请求,然后return 一个对象,怎么同步实现?

    比如:微信小程序分享时会调用 onShareAppMessage 方法,他会return 一个对象作为分享时的参数。但是我需要在他return之前调用一个ajax方法getShareCode,怎么样同步实现?

    //将字符串链接转为二维码,如:转换前 itemid/344*fromuser/4909*shopid/75,转换后 KtIQE4j9OP4JNGS2dsZy
    getShareCode: function () {
        var that = this;
        util.request(api.CreateShareCode, {
          sharecode: 'itemid/' + that.data.productid + '*fromuser/' + user.getBuyerUserId() + '*shopid/' + that.data.shopId
        }).then(function (res) {
    
          if (res.statusCode === 0) {
            that.setData({ newShareCode: res.sharedata });
          }
        });
      },
    
      //分享功能
      onShareAppMessage: function () {
        this.getShareCode();
        let that = this;
        var newShareCode = that.data.newShareCode;
        var shareBackUrl = 'pages/goods/goods?scene=' + newShareCode;
        return {
          title: that.data.goods.title,
          path: shareBackUrl
        }
      },

    尝试用async await 和 Promise都没有得到想要的结果。

    不能用async await原因是, 如果 onShareAppMessage 是async函数,分享时会调用这个方法,但是分享的事件是走的默认的分享,没用使用我return的参数对象。Promise同理。

    而且return的对象写到请求方法里面也会出现上面的问题:方法会被调用,但是分享事件没有用return的参数。如下:

    //分享功能
      onShareAppMessage: function () {
        var that = this;
        util.request(api.CreateShareCode, {
          sharecode: 'itemid/' + that.data.productid + '*fromuser/' + user.getBuyerUserId() + '*shopid/' + that.data.shopId
        }).then(function (res) {
    
          if (res.statusCode === 0) {
            var newShareCode = res.sharedata;
            var shareBackUrl = 'pages/goods/goods?scene=' + newShareCode;
            return {
              title: that.data.goods.title,
              path: shareBackUrl
            }
          }
        });
      },    

    jQuery的ajax请求可以这么设置同步请求:

    $.ajaxSetup({
        async: false
    });

    async 方法,别人调用的时候,会立刻返回一个Promise,而return里的path,则是在返回的那个getShareCode里获取的。微信调用这个方法拿的是返回值,也就是一个Promise,而Promise里没有他需要的那些参数,所以就是默认的分享了。
    换句话说,这个Share回调不允许有异步操作。能改成同步就改,不能改的话,就得改代码逻辑了。

    结果发现这个Share回调还真不允许有异步操作。

    曲线救国的方法就多了,比如:

    1、在页面加载的时候先请求好数据,存在data里

    2、写个阻塞的函数

    3、封装自己的分享函数onShareAppMessage实现分享参数的动态获取

  • 相关阅读:
    使用EF批量新增数据十分缓慢
    EF中获取当前上下文的表名
    下拉框停用数据的处理
    CEILING保留n位小数向上取整
    MVC ValidationAttribute 验证一个字段必须大于另一个字段
    EF通过导航属性取出从表的集合后,无法删除子表
    我得新博客上线了采用Vue+Layui的结合开发,后台采用asp.net mvc
    CTS,CLS,CLR解释
    Linq与委托
    C#4.0的十种语法糖
  • 原文地址:https://www.cnblogs.com/banma/p/12085122.html
Copyright © 2011-2022 走看看