uniapp分享到微信好友和朋友圈
首先目前的微信小程序只支持页面中右上角三个点触发分享功能,页面按钮只能触发分享至微信好友的功能
<template>
<view class="share">
<button open-type="share"> //open-type="share"这是关键,通过按钮触发,必须加按钮和这句代码
<image :src="item.icon" mode='heightFix' @click="share_action"></image>
<text>分享</text>
</button>
</view>
</template>
<script>
export default {
data(){
return {}
},
onShow(){
//这是设置右上角的三个点点击后是否可以分享给微信好友,或朋友圈
wx.showShareMenu({
withShareTicket:true,
//设置下方的Menus菜单,才能够让发送给朋友与分享到朋友圈两个按钮可以点击
menus:["shareAppMessage","shareTimeline"]
})
},
methods:{
// 分享到朋友圈
onShareTimeline(options) {
let that = this
let data = {
title:'', // 默认是小程序的名称
// path: '/pages/share/share', // 页面路径,默认是当前页面,必须是以‘/’开头的完整路径
imageUrl: '', // 图片封面,本地文件路径、网络图片路,支持PNG及JPG,默认当前页面截图,显示图片长宽比是 5:4。
success: res => {
// 分享成功
if (res.errMsg == 'shareAppMessage:ok') {}
},
fail: res => {
// 用户取消
if (res.errMsg == 'shareAppMessage:fail cancel') {}
// 分享失败
if (res.errMsg == 'shareAppMessage:fail') {}
},
complete: res => {}
}
return data
},
// 分享给好友
onShareAppMessage(options){
var that = this;
// 设置菜单中的转发按钮触发转发事件时的转发内容
var shareObj = {
title:'', // 默认是小程序的名称(可以写slogan等)
desc:'',// 小程序的描述
path: '/pages/share/index', // 默认是当前页面,必须是以‘/’开头的完整路径
imageUrl: '', // 图片封面,本地文件路径、网络图片路,支持PNG及JPG,默认当前页面截图,显示图片长宽比是 5:4。
success: function(res){
// 转发成功之后的回调
if(res.errMsg == 'shareAppMessage:ok'){
console.log(res)
}
},
fail: function(){
// 转发失败之后的回调
if(res.errMsg == 'shareAppMessage:fail cancel'){
console.log(res)
// 用户取消转发
}else if(res.errMsg == 'shareAppMessage:fail'){
console.log(res)
// 转发失败,其中 detail message 为详细失败信息
}
},
complete: fucntion(){
// 转发结束之后的回调(转发成不成功都会执行)
}
}
// 来自页面内的按钮的转发
if( options.from == 'button' ){
var eData = options.target.dataset;
console.log( eData.id); // shareBtn
// 此处可以修改 shareObj 中的内容
shareObj.path = '/pages/share/index'
}
// 返回shareObj
return shareObj;
},
}
}
</script>
版权声明:本文为weixin_45781661原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。