Vue 获取到分享到朋友圈按钮怎么实现呢？

Question

Vue 获取到分享到朋友圈按钮怎么实现呢？

    let wxUrl = {
                    wxUrl: encodeURIComponent(location.href.split('#')[0])
                };
                axios.post(`${this.URLshare}`, qs.stringify(wxUrl)).then((data) => {
                    console.log(data.data.resultObject);
                    var desc = this.content;
                    var title = "抽奖活动";
                    var imgUrl = urlImg;
                    var lineLink = url;
                    wx.config({
                        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                        appId: data.data.resultObject.appid, // 必填，公众号的唯一标识
                        timestamp: data.data.resultObject.timestamp, // 必填，生成签名的时间戳
                        nonceStr: data.data.resultObject.noncestr, // 必填，生成签名的随机串
                        signature: data.data.resultObject.signature, // 必填，签名，见附录1
                        jsApiList: ['checkJsApi', 'onMenuShareTimeline', 'onMenuShareAppMessage', 'onMenuShareQQ', 'onMenuShareWeibo',
                            'onMenuShareQZone'
                        ] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2
                    });
                    wx.ready(function() {
                        //分享到朋友圈
                        wx.onMenuShareTimeline({
                            title: title, // 分享标题
                            link: lineLink, // 分享链接
                            imgUrl: imgUrl, // 分享图标
                            type: '', // 分享类型,music、video或link，不填默认为link
                            dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                            success: function() {
                                //alert('已分享')
                                // 用户确认分享后执行的回调函数
                            },
                            cancel: function() {
                                //lert('已取消')
                                // 用户取消分享后执行的回调函数
                            }
                        });
                        //  分享给朋友
                        wx.onMenuShareAppMessage({
                            title: title, // 分享标题
                            desc: desc, // 分享描述
                            link: lineLink, // 分享链接
                            imgUrl: imgUrl, // 分享图标
                            type: '', // 分享类型,music、video或link，不填默认为link
                            dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
                            success: function() {
                                //alert('已分享')
                                // 用户确认分享后执行的回调函数
                            },
                            cancel: function() {
                                //lert('已取消')
                                // 用户取消分享后执行的回调函数
                            }
                        });
                        //分享到QQ
                        wx.onMenuShareQQ({
                            title: title, // 分享标题
                            desc: desc, // 分享描述
                            link: lineLink, // 分享链接
                            imgUrl: imgUrl, // 分享图标
                            success: function() {
                                //alert('已分享')
                                // 用户确认分享后执行的回调函数 
                            },
                            cancel: function() {
                                //alert('已取消')
                                // 用户取消分享后执行的回调函数
                            }
                        });
                        //分享到微博
                        wx.onMenuShareWeibo({
                            title: title, // 分享标题
                            desc: desc, // 分享描述
                            link: lineLink, // 分享链接
                            imgUrl: imgUrl, // 分享图标
                            success: function() {
                                //alert('已分享')
                                // 用户确认分享后执行的回调函数
                            },
                            cancel: function() {
                                //alert('已取消')
                                // 用户取消分享后执行的回调函数
                            }
                        });
                        //分享到空间
                        wx.onMenuShareQZone({
                            title: title, // 分享标题
                            desc: desc, // 分享描述
                            link: lineLink, // 分享链接
                            imgUrl: imgUrl, // 分享图标
                            success: function() {
                                //alert('已分享')
                                // 用户确认分享后执行的回调函数
                            },
                            cancel: function() {
                                //alert('已取消')
                                // 用户取消分享后执行的回调函数
                            }
                        });
                    });

                }).catch((error) => {
                    console.log(error);
                })

我页面上有按钮可以分享到朋友圈 点击我想进入这个页面，因为我们这是活动页面，点击按钮等于点击了分享到朋友圈 这个按钮，。怎么实现呢

Answer 1

我记得微信web分享只能通过右上角的三个点进行分享,只有app才可以实现自定义按钮的分享
可以点击按钮后弹出 蒙层+tip的形式 引导用户在右上角进行分享