先看看最后的效果 ios注意分享出去的链接传参不能带汉字哦!!!!
引微信js-sdk 可以用 npm 安装 (npm install weixin-js-sdk --save)
配置wx.config 信息一定要正确
1.在根目录common文件下新建wechat.js 配置wx.config
//引入js-sdk
import wx from '@/node_modules/jweixin-module/lib/index.js'
//引入request,这里WxOpenApp是自己封装的接口方法(可以直接用uni.request)
export default {
getConfig(infoTitle, infoDesc, infoLink, infoImg) { //自定义分享所需要的参数
WxOpenApp({
targetUrl: 'https:/xxx.xxx.xxx/share/' //传给后台的参数
}).then(res => {
wx.config({
debug: false, //测试时候用true 能看见wx.config的状态是否是config:ok
appId: res.data.appid, // 必填,公众号的唯一标识(公众号的APPid)
timestamp: res.data.timestamp, // 必填,生成签名的时间戳
nonceStr: res.data.noncestr, // 必填,生成签名的随机串
signature: res.data.signature, // 必填,签名
jsApiList: [
'onMenuShareTimeline', // 分享给好友
'onMenuShareAppMessage', // 分享到朋友圈
'updateAppMessageShareData', // 分享给好友1.4
'updateTimelineShareData' // 分享到朋友圈1.4
], // 必填,需要使用的JS接口列表
openTagList: ['wx-open-launch-app'] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']
});
wx.ready(function() {
var shareData = {
title: infoTitle, // 分享标题
desc: infoDesc, // 分享描述
link: infoLink, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: infoImg, // 分享图标
success: function(res) {}
};
//自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容(1.4.0)
wx.updateTimelineShareData(shareData);
//自定义“分享给朋友”及“分享到QQ”按钮的分享内容(1.4.0)
wx.updateAppMessageShareData(shareData);
})
});
}
}
2.main.js注入
import wechat from './common/wechat.js'
Vue.prototype.$wx = wechat
3.分享页面onload使用
let title = '自定义标题'
let infoDesc='自定义副标题'
let infoLink = '分享链接'
let infoImg='自定义分享图片'
this.$wx.getConfig(title, infoDesc, infoLink, infoImg);
有问题,进qq群 :325021815
大功告成 撒花~