• 微信分享及分享功能的显示和隐藏


    最近写的项目中涉及到了微信分享,因此将一些分享方面的知识梳理一下。其中还涉及到对分享功能的隐藏和显示。

    在vue页面的js 中放入如下代码:

    const wx = require('weixin-js-sdk')
    export default {
      name: 'HelloWorld',
      data () {
        return {
          msg: 'Welcome to Your Vue.js App',
          notShowMask: false,
        }
      },
      mounted:function () {
        wx.hideOptionMenu();
        this.$nextTick(function () {
          this.getConfig();
        })
      },
      methods: {
    // 微信分享参数
        getConfig() {
          let url = location.href.split('#')[0] //获取锚点之前的链接
          wxAuthApi.getConfigData(url)//向服务器获取微信配置初始化需要的参数
            .then(response => {
    
            let res = response.data.data;
              logObj(res);
            this.wxInit(res);
          })
        },
        // 微信分享
        wxInit(res) {
          let flag=this.notShowMask
          let links = "http://www.baidu.com";
          let title = '分享测试哦';
          let desc = '了解更多知识,请关注“庄游”公众号';
          let imgUrl = "";
          wx.config({
            debug: false,
            appId: res.appId,
            timestamp: res.timestamp,
            nonceStr: res.nonceStr,
            signature: res.signature,
            jsApiList: ['hideMenuItems','showMenuItems','onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo', 'onMenuShareQZone']
          });
    
          wx.ready(function () {
            if(!flag){
              wx.hideMenuItems({ menuList: ['menuItem:share:QZone', 'menuItem:share:appMessage',
                  'menuItem:share:qq','menuItem:share:timeline','menuItem:favorite'
                ]
              });
            }else{
              wx.showMenuItems({ menuList: ['menuItem:share:QZone', 'menuItem:share:appMessage',
                  'menuItem:share:qq','menuItem:share:timeline','menuItem:favorite'
                ]
              });
            }
            wx.onMenuShareTimeline({
              title: title, // 分享标题
              desc: desc, // 分享描述
              link: links, // 分享链接
              imgUrl: imgUrl, // 分享图标
              ready: function(){
                alert("I am share ready")
              },
              success: function () {
    //               alert("分享到朋友圈成功")
                //Toast({
                //message: "成功分享到朋友圈"
                //});
              },
              cancel: function () {
    //               alert("分享失败,您取消了分享!")
                //Toast({
                //message: "分享失败,您取消了分享!"
                //});
              }
            });
            //微信分享菜单测试
            wx.onMenuShareAppMessage({
              title: title, // 分享标题
              desc: desc, // 分享描述
              link: links, // 分享链接
              imgUrl: imgUrl, // 分享图标
              success: function () {
                // alert("成功分享给朋友")
    //              Toast({
    //                message: "成功分享给朋友"
    //              });
              },
              cancel: function () {
                // alert("分享失败,您取消了分享!")
    //              Toast({
    //                message: "分享失败,您取消了分享!"
    //              });
              }
            });
            wx.onMenuShareQQ({
              title: title, // 分享标题
              desc: desc, // 分享描述
              link: links, // 分享链接
              imgUrl: imgUrl, // 分享图标
              success: function () {
                // alert("成功分享给QQ")
    //              Toast({
    //                message: "成功分享到QQ"
    //              });
              },
              cancel: function () {
                // alert("分享失败,您取消了分享!")
    //              Toast({
    //                message: "分享失败,您取消了分享!"
    //              });
              }
            });
            wx.onMenuShareWeibo({
              title: title, // 分享标题
              desc: desc, // 分享描述
              link: links, // 分享链接
              imgUrl: imgUrl, // 分享图标
              success: function () {
                // alert("成功分享给朋友")
    //              Toast({
    //                message: "成功分享到腾讯微博"
    //              });
              },
              cancel: function () {
                // alert("分享失败,您取消了分享!")
    //              Toast({
    //                message: "分享失败,您取消了分享!"
    //              });
              }
            });
            wx.onMenuShareQZone({
              title: title, // 分享标题
              desc: desc, // 分享描述
              link: links, // 分享链接
              imgUrl: imgUrl, // 分享图标
              success: function () {
                // alert("成功分享给朋友")
    //              Toast({
    //                message: "成功分享到QQ空间"
    //              });
              },
              cancel: function () {
                // alert("分享失败,您取消了分享!")
    //              Toast({
    //                message: "分享失败,您取消了分享!"
    //              });
              }
            });
    
          });
          wx.error(function (err) {
            alert(JSON.stringify(err))
          });
    
        }
      }
      }
    

      

  • 相关阅读:
    for循环实战性能优化
    MySQL group_concat 介绍
    MySQL 取分组后每组的最新记录
    MySQL查询top N记录
    常用SQL之日期格式化和查询重复数据
    Java 8 ThreadLocal 源码解析
    避免创建不必要的对象
    IntelliJ IDEA 设置忽略SVN文件和文件夹
    scrapy+selenium+chromedriver解析动态渲染页面
    java读取excel或者csv时日期格式数据处理
  • 原文地址:https://www.cnblogs.com/jing58/p/10026605.html
Copyright © 2020-2023  润新知