1. 在Vue项目index.html引入官方js
https://res.wx.qq.com/open/js/jweixin-1.4.0.js
2. src下新建文件夹 weixin/wxjdk.js，代码如下
import axios from 'axios'
export default {
wxShowMenu: function() {
let url = location.href; //获取当前页面地址
axios.get('hyr/user/customApply/getJsapiTicket?url='+url).then(function(res) {
var getMsg = res.data.resultBody;
console.log(getMsg.appid,getMsg.timestamp,getMsg.nonceStr,getMsg.signature)
wx.config({
debug: false, //生产环境需要关闭debug模式
appId: getMsg.appid, //appId通过微信服务号后台查看
timestamp: getMsg.timestamp, //生成签名的时间戳
nonceStr: getMsg.nonceStr, //生成签名的随机字符串
signature: getMsg.signature, //签名
jsApiList: [ //需要调用的JS接口列表
'onMenuShareTimeline', //分享给好友
'onMenuShareAppMessage', //分享到朋友圈
]
});
wx.ready(function() {
//分享到朋友圈
wx.onMenuShareTimeline({
title: "", // 分享标题
desc: "", //分享描述
link:url,
imgUrl: '' , // 分享图标
});
//分享给朋友
wx.onMenuShareAppMessage({
title: "", // 分享标题
desc: "", // 分享描述
link:url,
imgUrl: '' , // 分享图标
success: function () {
// 成功回调函数
},
cancel: function () {
// 失败回调函数
}
});
});
})
}
}
3. main.js中导入
import WXConfig from './weixin/wxsdk' // 微信分享
Vue.prototype.WXConfig = WXConfig
4. 页面调用
this.WXConfig.wxShowMenu();
