微信小程序全局使用分享

最近使用UniApp开发微信小程序,需要用到微信分享功能,但是小程序测试的时候分享图标是灰色,无法完成分享功能,如果是单页面分享,可以直接在页面写方法中写
            onShareAppMessage() {
                return {
                    title: "欢迎体验",
                    path: '/pages/login/login',
                    imageUrl:'https://web-assets.dcloud.net.cn/unidoc/zh/share-logo@3.png'
                }
            }

如果需要全局都有分享功能,那么就必须在main.js 中引入分享的js文件

export default {
    data() {
        return {}
    },
    created() {
            //#ifdef MP-WEIXIN 显示分享图标
            wx.showShareMenu({
                withShareTicket: true,
                menus: ['shareAppMessage', 'shareTimeline']
            });
            //#endif
        },
    onload(){
        wx.showShareMenu({
            withShareTicket: true,
            menus: ['shareAppMessage', 'shareTimeline']
        });
    },
    //1.配置发送给朋友
    onShareAppMessage() {
        return {
            title: '欢迎体验', //分享的标题
            path: 'pages/login/login', //点击分享链接之后进入的页面路径
            imageUrl: '/static/loginex.png', //分享发送的链接图片地址
            success() {
                // 分享完成,请注意此时不一定是成功分享
                uni.showToast({
                    title: "分享成功",
                    duration: 3500,
                    icon: "success"
                });
            },
            fail() {
                // 分享失败
                uni.showToast({
                    title: "分享失败",
                    duration: 3500,
                    icon: "error"
                });
            }
        };
    },
    //2.配置分享到朋友圈
    onShareTimeline() {
        return {
            title: '欢迎体验', //分享的标题
            query: 'pages/login/login', //点击分享链接之后进入的页面路径
            imageUrl: '/static/loginex.png' ,//分享发送的链接图片地址
            success() {
                // 分享完成,请注意此时不一定是成功分享
                uni.showToast({
                    title: "分享成功",
                    duration: 3500,
                    icon: "success"
                });
            },
            fail() {
                // 分享失败
                uni.showToast({
                    title: "分享失败",
                    duration: 3500,
                    icon: "error"
                });
            }
        }
    }
}

VUE3中main.js中的function createApp()加入app.mixin(share)

posted @ 2024-09-18 10:18  蓬鹏  阅读(84)  评论(0编辑  收藏  举报