小程序分享

分享页面（part1）

分享触发

在分享触发的地方，如下函数
与onShow()，onLoad()同级

onShareAppMessage:function(option){const that = this;//来自页面按钮内的分享if(option.from === 'button'){//方法}return {title:'【'+this.companyName+'】'+'正在邀请您加入**！',//分享的标题path:'/pages/my/getSessionKey?shareCode='+that.shareCode,//好友点击分享之后跳转的页面/传参数imageUrl:"https://img2.woyaogexing.com/2022/12/07/f6980578ce23442940f5c85e29f646f4.jpeg",//分享的图片（地址需要为可访问的图片地址）}//一定要返回对象
},

分享跳转页面

在实际开发中，我选择了一个页面作为中间页面，进行参数的接收
用户在点击分享链接的时候，就会先进入这个页面再进行跳转到目标页面，实际也不需要，可以直接在目标页面进行参数接收

<template><view></view>
</template><script>import {defineComponent,reactive,toRefs} from 'vue';import {toasting} from '../../utils';import Api from '../../service/api'export default defineComponent({name: 'sharePage',onLoad(options) {this.shareCode = options.shareCodeuni.setStorageSync('shareCode', this.shareCode)},onShow(){this.ifLogin()},setup() {const state = reactive({haveLogin: false,shareCode: ''})const ifLogin = () => {uni.navigateTo({url: '/pages/my/getSessionKey'})}return {...toRefs(state),ifLogin,}}})
</script><style lang="less" scoped>.joinButton{width: 100%;text-align: center;button{width: 90%;background-color: #32a4e6;color: #fff;}}
</style>

分享到朋友圈

开关

onLoad(){wx.showShareMenu({withShareTicket:true,menus:["shareAppMessage","shareTimeline"]})
}，

触发

//小程序分享到朋友圈
onShareTimeline() {return {title: "分享标题",//标题imageUrl: "",//封面query:"abc="+this.abc+"&series="+this.series//传递多个参数书写方式，不用写页面位置};
}

ps：这里的分享到朋友圈，虽然不需要指定页面，但是默认在其他人访问分享时，是一个单页面，所以这个页面需要进行接口的适配和参数的处理

uniApp分享

小程序中的写法有的在uniapp中可以直接写，例如part1的实现

分享页面

uni.share({provider:'weixin',//分享服务提供商（即weixin|qq|sinaweibo）scene:"WXSceneSession",//WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏)type:4,//0是文件，4是视频title:"分享视频标题",//标题summary:"",href:"https://xxx.mp4",//分享跳转地址mediaUrl:"https://xx.mp4",//分享视频imageUrl:"",//分享图片路径(必须是线上可访问图片：http://xxx、https://xxx等)success:function(res){console.log("success:" + JSON.stringify(res));},fail:function(err){console.log("fail:" + JSON.stringify(err));}
})

分享到朋友圈

uni.share({provider: 'weixin', //分享服务提供商（即weixin|qq|sinaweibo）scene: "WXSceneTimeline", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏)type: 0,//分享文件为0，分享视频为4href: "https://xxxxxx.mp4", //分享跳转地址title: "文件标题",summary: "",imageUrl: "", //分享图片路径(必须是线上可访问图片：http://xxx、https://xxx等)success: function(res) {// console.log("success:" + JSON.stringify(res));},fail: function(err) {// console.log("fail:" + JSON.stringify(err));}
});

【uniapp】uniapp小程序分享功能（App分享）相关推荐

uni-app开发小程序直播功能
uni-app开发小程序直播功能 1.微信后台申请插件开通 2.微信后台开通直播功能 3.代码中接入直播插件AppID 4.[直播组件]如何使用 5.直播组将状态获取微信开发直播功能,需要企业账号: ...
uniapp微信小程序和打包app的分享功能
小程序端和app端分享html:  <view class="goodsMenu" @click="ap ...
uniapp 打包H5，打包小程序，打包app分享到微信聊天、朋友圈
1.uniapp打包H5操作手法:Hbuilder->发行->网站-PC-WEB端或手机端H5访问,需要填写个访问域名,即发布后访问的域名路径 2.uniapp打包H5配置注意事项:uni ...
uniapp微信小程序onShareAppMessage 函数实现分享功能和实例页面代码
效果: 关键代码: <button class="separate-fl" plain="true" data-name="shareBtn&q ...
uni-app 微信小程序设置全局的分享onShareAppMessage
创建一个 mixins ,我的文件路径为 : common/share.js export default {onShareAppMessage(res) { //发送给朋友return {}},on ...
uniapp 微信小程序版本更新提示
uniapp 微信小程序版本更新提示 // app.vue onShow: function() {const updateManager = uni.getUpdateManager();updat ...
uni-app 微信小程序分享功能传参接收与调试
uni-app 微信小程序功能传参接收与调试当使用微信小程序进行分享好友功能时,怎样能够联调,查看是否接收到参数,并在被分享人点进来的时候逻辑处理是否正确. 1.分享功能实现分享给朋友 ...
uniapp —— 小程序实现带参分享微信、朋友圈以及调试获取参数
uniapp -- 小程序实现带参分享微信.朋友圈以及调试获取参数零.起因以及分类小程序我们在开发微信小程序的过程中,经常需要实现分享给微信用户或者分享到微信朋友圈的功能,基本上我们会用到 on ...
uni-app 微信小程序分享按钮
uni-app 微信小程序分享按钮官方文档说明在 manifest.json 的 App SDK 配置里,勾选微信消息及朋友圈,并填写相关 appkey,微信 appkey 在需要分享的页面填写: ...
uniapp转小程序分享到朋友圈
uniapp转小程序分享到朋友圈 uniapp转化成小程序,但是目前小程序只支持安卓手机进行朋友圈分享,ios目前还不支持. 文档link 我的项目是uniapp,就直接按照我的写法来进行展示: &l ...

【uniapp】uniapp小程序分享功能（App分享）

文章目录

小程序分享

分享页面（part1）

分享触发

分享跳转页面

分享到朋友圈

开关

触发

uniApp分享

分享页面

分享到朋友圈

【uniapp】uniapp小程序分享功能（App分享）相关推荐

最新文章

热门文章