一、需求描述
小程序个人中心生成二维码，用户点击生成二维码功能即可生成二维码，生成的二维码可分享。用户通过扫码或者分享的链接可进入到小程序首页某个产品的详情页
js文件
data: {
shareInfo:{},
productUuid:''
},
onLoad: function (options) {
this.setData({
productUuid:options.uuid
})
const params={
productUuid:options.uuid,
mNumber:options.mNumber
}
http.get('getQrCodeForAntiFraudNote',params).then(res=>{
this.setData({
shareInfo:res.data,
})
})
},
picPrereview: function (e) {
console.log(e);
wx.previewImage({
current: '', // 当前显示图片的http链接
urls: [e.currentTarget.dataset.pre] // 需要预览的图片http链接列表
})
},
getImageAuth(e) {
console.log(e);
const that = this
let url = e.currentTarget.dataset.pre
wx.getSetting({
success: res => {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success: () => {
that.saveImage(url)
},
fail: err => {
console.log(err);
that.showSettingToast('保存二维码需要访问您的相册', url)
}
})
} else {
that.saveImage(url)
}
}
})
},
showSettingToast(content, url) {
const that = this
wx.showModal({
content,
confirmText: "去开启",
cancelColor: '#85899D',
confirmColor: '#066FF6',
success: result => {
if (result.confirm) {
wx.openSetting({
success: res => {
if (res.authSetting['scope.writePhotosAlbum']) {
that.saveImage(url)
}
}
})
}
}
})
},
saveImage(url) {
wx.getImageInfo({
src: url,
success: res => {
console.log(res);
wx.saveImageToPhotosAlbum({
filePath: res.path,
success: res => {
console.log(res);
if (res.errMsg == 'saveImageToPhotosAlbum:ok') {
wx.showToast({
title: '保存成功',
icon: 'success'
})
}
}
})
}
})
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function (e) {
console.log(app.cityCode,'app.cityCode');
const that = this;
let {productUuid, shareInfo} = that.data;
return {
path: '/pages/tab1/productDetail/antiFraud/antiFraud?productUuid=' + productUuid + '&qrCodeUuid=' + shareInfo.shareCode + '&areaCode=' + app.cityCode,
success: function (res) {
console.log(res);
// 用户确认分享后执行的回调函数
console.log('success');
},
fail: function () {
console.log('fail');
}
}
}
wxml文件
<view class="qrCode-cont">
<view class="qrCode-img" hidden="{{hidden}}">
<image src="{{shareInfo.qrCodeUrl}}" data-pre="{{shareInfo.qrCodeUrl}}" bindtap="picPrereview"
bindlongpress="getImageAuth"></image>
<view class="fide-fz-14" style="color: #999; line-height: 40rpx;">点击预览图片，长按可保存图片</view>
</view>
</view>