1. 下载微信js-sdk
npm install weixin-js-sdk -s
2. main.js中引入js-sdk
import wx from 'weixin-js-sdk'
3.建一个wxConfig.js
import wx from 'weixin-js-sdk'
export function wxConfig(vm)
var url="xxx"; //后台分享接口
vm.$get(url).then(res=>{
let data = res.result.signPackage
wx.config({
beta: true,
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: data.appId, // 必填，公众号的唯一标识
timestamp: data.timestamp, // 必填，生成签名的时间戳
nonceStr: data.nonceStr, // 必填，生成签名的随机串
signature: data.signature, // 必填，签名，见附录1
jsApiList: [
'onMenuShareAppMessage',
'onMenuShareTimeline',
'onMenuShareWechat',
'hideAllNonBaseMenuItem'
]
});
wx.error(function (res) {
console.log("调用微信jsapi返回的状态:"+res.errMsg);
});
}).catch(function(error) {
console.info(error);
})
}
4.需要分享的页面
share(){
let that = this
wx.ready(function(){
//显示所有功能按钮
wx.showAllNonBaseMenuItem();
//转发
let title = 'xxxx'
let linkUrl = hostConfig.getHost()+'/h5/dalist/index.html#/cinema?shareProvinceId='+that.provinceId+'&shareCityId='+that.cityId+'&sharePage='+false
wx.onMenuShareAppMessage({
title:title , // 分享标题
desc:that.shareMessage.desc, // 分享描述
link:linkUrl, // 分享链接
imgUrl:that.shareMessage.imgUrl, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
//微信
wx.onMenuShareWechat({
title:title,
desc: that.shareMessage.desc,
link:linkUrl,
imgUrl:that.shareMessage.imgUrl,
success: function () {
},
cancel: function () {
}
});
//分享到朋友圈
wx.onMenuShareTimeline({
title: title,
link: linkUrl,
imgUrl: that.shareMessage.imgUrl,
success: function () {
},
cancel: function () {
}
});
})
}
5.不需要分享的页面
import wx from 'weixin-js-sdk'
import {wxConfig} from '@/assets/wxCofig.js'
share(){
wx.ready(function(){
wx.hideAllNonBaseMenuItem();
})
}
网友评论