zoukankan      html  css  js  c++  java
  • vue——配置微信分享

    参考:https://www.cnblogs.com/goloving/p/9256212.html

    1. main.js

    import WXConfig from '../../assets/js/wx.jsapi';

    2. wx.jsapi.js

    import axios from 'axios'
    
    export default {
        wxShowMenu: function(shareData) {
          var localURL = location.href.split('#')[0];
    
          var param = {
            'url': localURL
          };
          var wxData = shareData.wxData;//分享配置信息
          var Param1= shareData.param1;//假设需传参数1
          var Param2= shareData.param2;//假设需传参数2
         var ifshare = shareData.ifshare;//是否开启分享   
    var _this = shareData.that;   axios.get('*****', {//获取config信息链接   params: param   }).then(function(res) {   if (res.status == 200 && res.data.result == 0) {   var getMsg = res.data.message.ticket;   wx.config({   debug: false, //生产环境需要关闭debug模式    appId: getMsg.appId, //appId通过微信服务号后台查看   timestamp: getMsg.timestamp, //生成签名的时间戳   nonceStr: getMsg.nonceStr, //生成签名的随机字符串   signature: getMsg.signature, //签名    jsApiList: [ //需要调用的JS接口列表   'onMenuShareTimeline', //分享给好友   'onMenuShareAppMessage', //分享到朋友圈
             'hideMenuItems'
      ]   });    wx.ready(function() { /* wx.checkJsApi({ jsApiList: ["showMenuItems"], success: function(res) { wx.showMenuItems({ menuList: [ 'menuItem:share:appMessage', //发送给朋友 'menuItem:share:timeline' //分享到朋友圈 ] }); } });*/

            if (ifshare == '1') {//后端未开启分享则屏蔽分享菜单
              wx.hideAllNonBaseMenuItem();
              return;
            }

              //分享到朋友圈
              wx.onMenuShareTimeline({
                title: wxData.title, // 分享标题
                desc: wxData.info, //分享描述
                link: wxData.shareurl, // 分享链接
                imgUrl: wxData.img, // 分享图标
                success: function(res) {
                  // 用户确认分享后执行的回调函数
                  var param = {
                    param: {
                      param1: Param1,
                      param2: Param2
                    }
                  }
                  _this.axios.get('****', {//分享回调链接,用于自行记录判断之类
                    params: param
                  }).then(function(res) {
                    if (res.status == 200 && res.data.result == 0) {
                      console.log('分享成功');
                    }
                  }).catch(function(err) {
                    console.log(err);
                  })
                  console.log("分享朋友圈成功返回的信息为:", res);
                },
                cancel: function(res) {
                  // 用户取消分享后执行的回调函数
                  console.log("取消分享朋友圈返回的信息为:", res);
                }
              });
    
    
              //分享给朋友
              wx.onMenuShareAppMessage({
                title: wxData.title, // 分享标题
                desc: wxData.info, //分享描述
                link: wxData.shareurl, // 分享链接
                imgUrl: wxData.img, // 分享图标
    
                success: function(res) {
                  // 用户确认分享后执行的回调函数
                  var param = {
                    param: {
                      param1: Param1,
                      param2: Param2
                    }
                  }
                  _this.axios.get('****', {//分享回调链接,用于自行记录判断之类
                    params: param
                  }).then(function(res) {
                    if (res.status == 200 && res.data.result == 0) {
                      console.log('分享成功');
                    }
                  }).catch(function(err) {
                    console.log(err);
                  })
                  console.log("分享朋友圈成功返回的信息为:", res);
                },
                cancel: function(res) {
                  // 用户取消分享后执行的回调函数
                  console.log("取消分享给朋友返回的信息为:", res);
                }
              });
            });
          }
        })
      },        
    }

    3. vue中

    activated(){
         this.getShare();//放在这里获取是因为我用了keep-alive(在组件切换过程中将状态保留在内存中,防止重复渲染DOM),而此方法需要“每次进入组件都调用,从而初始化微信分享配置等”——关键,否则分享会出问题。
     },
     methods(){
      getShare(){
            let _this = this,
                shareData = {
                 wxData: wxShareInfo,//分享配置信息
                 param1: _this.param1,
                 param2: _this.param2,
                 ifshare: _this.ifshare,
                 that: _this
             };
        _this.WXConfig.wxShowMenu(shareData);
      }
    }
  • 相关阅读:
    BZOJ 1452 Count(二维树状数组)
    BZOJ 1407 Savage(拓展欧几里得)
    BZOJ 1415 聪聪和可可(期望DP)
    BZOJ 1406 密码箱(数论)
    最大流小结
    UVA6531Go up the ultras
    二分图小结
    Codeforces Round #243 (Div. 1)
    图论模板集合
    zoj3416 Balanced Number
  • 原文地址:https://www.cnblogs.com/linjiangxian/p/11679213.html
Copyright © 2011-2022 走看看