微信分享

╰+哭是因爲堅強的太久メ 2022-12-13 01:48 252阅读 0赞

index.js

import wxapi from '@/utils/wxapi'
    import {  getWxShare } from '@/api/index'; // 获取签名 appid的
    
    const mixin = { 
        data() { 
            return { 
                wxshare: { },
            }
        },
        methods: { 
            // 微信分享
            async fShare(){ 
                let data = await getWxShare();
                if(data){ 
                    wxapi.wxRegister(data.data.body,this.wxshare);
                }
            },
        },
    }
    
    export default mixin

main.js

import Vue from 'vue'
    import mixins from './mixin/index'; // 上面的index.js
    Vue.mixin(mixins);
    Vue.config.productionTip = false
    new Vue({ 
      router: router,
      render: h => h(App),
    }).$mount('#app')

import wx from 'weixin-js-sdk'
    
    const wxApi = { 
        wxRegister(data){ 
            let Share = { 
                title: '标题',
                link: location.href,
                desc: '嘻嘻嘻嘻嘻嘻',
                imgUrl: '这是那个图片',
                type: 'link', // 分享类型：music、video或link，不填默认为link
                dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                success: function () { 
                    console.log('分享ok');
                },
                cancel: function () {  
                    console.log('分享null');
                }
            };
            wx.config({ 
                debug: false, // 开启调试模式
                appId: data.appId, // 必填，公众号的唯一标识
                timestamp: data.timestamp, // 必填，生成签名的时间戳
                nonceStr: data.nonceStr, // 必填，生成签名的随机串
                signature: data.signature, // 必填，签名，见附录1
                jsApiList: [
                    'updateAppMessageShareData',
                    'updateTimelineShareData',
                    // 'hideAllNonBaseMenuItem', // 去掉分享
                    // 'hideMenuItems'
                ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
            })
                    
            wx.ready(function(){ 
                console.log("ready")
                wx.updateAppMessageShareData(Share);
                wx.updateTimelineShareData(Share);
                // wx.hideAllNonBaseMenuItem(); // 去掉分享
                // wx.hideMenuItems({ 
                // menuList: [
                // 'menuItem:exposeArticle',
                // 'menuItem:setFont',
                // 'menuItem:share:appMessage',
                // 'menuItem:share:timeline'
                // ] // 要显示的菜单项，所有menu项见附录3
                // });
            })
        }
    }
    export default wxApi

调用

mounted() { 
       this.fShare();
     },