微信小程序 分享给好友
1.wxml代码
<button class="fixed-text fixed-button" open-type="share" title="分享" hover-class="none">分享好友</button>
2.js代码
onShareAppMessage:function(res) {
if (res.from == 'button') {
console.log(res.target, res)
}
return {
title:'这里是发送时候的标题',
path:'/pages/home/index',//这里是被分享的人点击进来之后的页面
imageUrl: '../../images/icon-logo.png'//这里是图片的路径
}
},
之后根据项目需求,一个页面中需要点击不同的按钮,返回时进入不同的页面,例如下图,点击分享给好友 ,分享成功之后,别人点击进来进人的是小程序的首页,点击邀请好友入岛,分享链接成功之后,别人点击进来是申请入岛页面,这样就会有两个 被分享的人点击进来的页面,因此需要采用下面这种方,添加属性 id,具体代码如下:
wxml代码:
<view class="content">
<view class="content_title">分享说明</view>
<rich-text class="text_content" nodes="{{share_content.content}}"></rich-text>
<view class="tool_item friend_btn">
<view>分享给好友或者微信群</view>
<button open-type="share" title="分享" id="1">1</button>
</view>
<view class="tool_item haibao_btn">
<view>保存我的专属海报图片</view>
<button bindtap='baocun'>1</button>
</view>
<view class="tool_item dao_btn">
<view>邀请好友入岛</view>
<button open-type="share" title="分享" id="2">1</button>
</view>
</view>
js代码
onShareAppMessage:function(res) {
var that = this;
if (res.from == 'button') {
// 点击分享给好友或者微信群的返回
if(res.target.id == 1){
return{
title:'河北书岛',
path:that.data.share_content.my_url,//这里是被分享的人点击进来之后的页面
imageUrl:that.data.qrcode //这里是图片的路径
}
}
// 点击邀请好友入岛的返回
if(res.target.id == 2){
return{
title:'河北书岛',
path:that.data.share_content.invit_url,//这里是被分享的人点击进来之后的页面
imageUrl:'/images/icon-login-index.png' //这里是图片的路径
}
}
}
// 点击右上角分享的返回
return {
title:'河北书岛',
path:that.data.share_content.my_url,//这里是被分享的人点击进来之后的页面
imageUrl:that.data.qrcode //这里是图片的路径
}
},