网站开发的公司属于什么行业,成都网络公司优惠政策,食品网站建设优化案例,seo教程一、引言 小程序中用户点击分享后#xff0c;在 js 中定义 onShareAppMessage 处理函数#xff08;和 onLoad 等生命周期函数同级#xff09;#xff0c;设置该页面的分享信息。 用户点击分享按钮的时候会调用。这个分享按钮可能是小程序右上角原生菜单自带的分享按钮…一、引言 小程序中用户点击分享后在 js 中定义 onShareAppMessage 处理函数和 onLoad 等生命周期函数同级设置该页面的分享信息。 用户点击分享按钮的时候会调用。这个分享按钮可能是小程序右上角原生菜单自带的分享按钮也可能是开发者在页面中放置的分享按钮button open-typeshare此事件需要 return 一个Object用于自定义分享内容 二、平台差异说明
AppH5微信小程序支付宝小程序百度小程序抖音小程序、飞书小程序QQ小程序快手小程序京东小程序xx√√x√√√√
参数类型说明平台差异说明fromString分享事件来源button页面内分享按钮、menu右上角分享按钮targetObject如果 from 值是 button则 target 是触发这次分享事件的 button否则为 undefinedwebViewUrlString页面中包含 web-view 组件时返回当前 web-view 的url微信小程序1.6.4、支付宝小程序、京东小程序
此事件需要 return 一个 Object用于自定义分享内容其内容如下
参数名类型必填说明平台差异说明titleString是分享标题pathString是页面 path 必须是以 / 开头的完整路径。注意京东小程序开头不要加/QQ小程序不支持imageUrlString否分享图标路径可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG。显示图片长宽比是 5:4contentString否百度小程序表现为分享内容支付宝小程序表现为吱口令文案百度小程序、支付宝小程序descString否自定义分享描述支付宝小程序、抖音小程序、京东小程序bgImgUrlString否自定义分享二维码的背景图建议大小750*950网络图片路径支付宝小程序queryString否QQ小程序查询字符串必须是 key1val1key2val2 的格式。从这条转发消息进入后可通过 qq.getLaunchOptionSync() 或 qq.onShow() 获取启动参数中的 query。QQ小程序templateIdString否开发者后台设置的分享素材模板 id抖音小程序mpIdString否微信小程序id此场景用于分享到微信后用户点击分享卡片进入该appid对应的微信小程序实现引流到微信小程序京东小程序typeNumber否转发形式0 - 微信小程序正式版 1 - 微信小程序开发版2 - 微信小程序体验版京东App9.0.0开始不填或者其他值都会先判断是否有url参数如果有打开分享后显示url对应页面否则默认生成京东小程序官方的一个分享中间页面点击可跳到京东app里面的对应小程序。京东小程序mpPathString否微信小程序路径京东小程序channelString否渠道不写默认微信朋友微信朋友圈京东小程序urlString否h5链接地址h5分享填写不填默认中间页京东小程序successFunction否接口调用成功的回调函数支付宝小程序、百度小程序failFunction否接口调用失败的回调函数支付宝小程序、百度小程序completeFunction否接口调用结束的回调函数调用成功、失败都会执行百度小程序
注意
微信、头条平台只有定义了此事件处理函数小程序右上角菜单才会显示“转发”按钮QQ小程序还支持通过qq.offShareAppMessage取消对系统分享按钮的监听
三、踩坑
问题vue3 setup scirpt语法使用onShareAppMessage编译到微信小程序小程序分享不生效
原因当前onShareAppMessage其实是被全局的onShareAppMessage给覆盖了执行顺寻是先执行的页面再执行的全局。
ui-app issiiues https://github.com/dcloudio/uni-app/issiiues/3084
解决方案注冊全局的onShareAppMessage
globalShare.ts
/** Author: LYM* Date: 2024-03-25 19:23:20* LastEditors: LYM* LastEditTime: 2024-03-26 11:39:47* Description: 分享*/
import { onShareAppMessage } from dcloudio/uni-app
import share from /assets/images/share-1.jpgexport const globalShare {onShareAppMessage(e: any) {if (e.from button) {return {title: e.target.dataset.title ?? 科创知识订阅,path: /pages/detail/index?url${encodeURIComponent(e.target.dataset.url)},imageUrl: share,success() {debuggeruni.showToast({title: 分享成功})},fail() {uni.showToast({title: 分享失败,icon: none})}}}}
}buttonopen-typeshare:data-urlurl ?? :data-titletitleclassshare-btnekr-icon open-typeshare nameicon-share/ekr-icon/button
