React中使用微信分享

 import wx from 'weixin-js-sdk'
const title = {
    myCollect: '我的收藏',
    goodsDetail: '产品详情',
    loginCpn: '登录',
    registerCpn: '注册新账号',
    forgetPasswordCpn: '找回密码',
    modifyPwdCpn: '修改登录密码',
    bindPhone: '绑定手机号码',
    accountInfoCpn: '账号信息',
    modifyNickNameCpn: '修改昵称',
    modifyPhoneCpn: '修改手机号',
    modifyResetPwdCpn: '重置密码',
    searchListCpn: '搜索',
    hotProducts: '热门优品',
    firstPage: '火联-网罗全球优品 洞察产品趋势',
    searchPage: '搜罗产品',
    specialPage: '精选专栏',
    personalCenter: '个人中心',
    goodsClassifyCpn: '产品分类',
    registerPhoneCpn: '微信登录',
    promotionPage: '火联网罗全球优品',
    womenFashion: '火联网罗全球优品',
    newProductHeat: '各品牌站热评新品趋势',
};
 componentDidMount() {
    this.commonFun();
   this.props.history.listen((e) => {
       this.commonFun(e.pathname);
   });
       wx.error((res) => {
            // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
          
        });
}
 commonFun = (pathNames = '') => {
        const session = window.sessionStorage, storage = window.localStorage;
        if (!session.getItem('initLink')) {
            session.setItem('initLink', window.location.href)
        }
        // 非ios设备，切换路由时候进行重新签名
        if (window.__wxjs_is_wkwebview !== true) {
            this.isIosFlag = false;
        }

        // ios 设备进入页面则进行js-sdk签名
        if (window.__wxjs_is_wkwebview === true) {
            this.isIosFlag = true;
        }
        let name = pathNames || this.props.history.location.pathname;
        let pathname = name.substring(1).split('/')[0];
        let detailPage = session.getItem('detailPages');
        this.origin = '';
        this.shareDesc = '致力于网罗全球优质、市场前沿产品，提供产品精选服务，激发产品设计灵感，帮助用户发掘吻合自己需求或最具市场潜力价值产品。';
        if ((pathname === 'newProductHeat' || pathname === 'myCollect' || pathname === 'specialPage' || pathname === 'searchPage') && detailPage) { //全球优品
            let productId = session.getItem('productId');
            this.pathname = storage.getItem('shareTitle');
            this.shareImg = storage.getItem('shareImg');
            this.shareDesc = storage.getItem('shareDesc');
            this.origin = window.location.origin + '/goodsDetail/' + productId;
        } else if (pathname === 'goodsDetail') { //详情页面
            this.pathname = storage.getItem('shareTitle');
            this.shareImg = storage.getItem('shareImg');
            this.shareDesc = storage.getItem('shareDesc');
            // this.origin = '';
        } else if (pathname === 'specialPage') {
            this.pathname = storage.getItem('shareTitle');
            this.shareImg = config.serverUrl + 'shareLogo.png';
        } else {
            // this.shareDesc = '';
            // this.origin = '';
            this.pathname = title[pathname];
            this.shareImg = config.serverUrl + 'shareLogo.png';
        }
        document.title = this.pathname || '火联网罗全球优品';
        this.getJsSdkSignatureHttp();
    };
// 完整的url链接
    getJsSdkSignatureHttp = () => { //获取jssdk签名
        //签名的路径一定不能修改，要取完整的url路径，而且路径？后面不能有特殊的字符，需要用encodeURIComponent方法处理一下
        axiosHttp('api/WeiXin/WeixinLogin/GetJsSdkSignature?url=' + (this.isIosFlag ? encodeURIComponent(window.sessionStorage.getItem('initLink')) : encodeURIComponent(window.location.href)), "", "GET").then((res) => {
            if (res.code === 200) {
                const {appId, timestamp, nonceStr, signature} = res.data;
                wx.config({
                    debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                    appId: appId, // 必填，公众号的唯一标识
                    timestamp: timestamp, // 必填，生成签名的时间戳
                    nonceStr: nonceStr, // 必填，生成签名的随机串
                    signature: signature,// 必填，签名，见附录1
                    jsApiList: [
                        'onMenuShareAppMessage',
                        'onMenuShareTimeline',
                        // 'updateAppMessageShareData',
                        // 'updateTimelineShareData',
                        // 微信新版1.4.0暂不支持安卓，故这里要两个接口一起调用下
                    ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
                });
                let data = {
                    link: this.origin || window.location.href,
                    imgUrl: this.shareImg, // 分享图标
                    title: document.title || '火联网罗全球优品', // 分享标题
                    desc: '',
                    success: () => {
                        // 用户确认分享后执行的回调函数
                    },
                    cancel: function () {
                        // 用户取消分享后执行的回调函数
                    }
                };


                wx.ready(() => {
                    //分享给朋友
                    wx.onMenuShareAppMessage({...data, desc: this.shareDesc});
                    // wx.updateAppMessageShareData({...data, desc: this.shareDesc});

                    //分享到朋友圈
                    wx.onMenuShareTimeline(data);
                    // wx.updateTimelineShareData(data);
                });
            }
        }).catch(e => {
            console.log(e);
        });
    };