微信小程序全局分享转发控制实现——从此无需页面单独配置
关于支付宝全局自定义分享控制详见:支付宝小程序的携带参数全局分享实现。
为什么要写这篇文章?
微信小程序没有全局分享配置,页面开启分享功能必须要在页面中定义分享事件函数 onShareAppMessage 才可以。如果项目中对页面分享的需求比较复杂点,那么默认的自定义分享会很麻烦的,而且还不一定能满足我们的需求,因此全局自定义分享配置的实现就非常有必要了。
不仅仅能实现全局分享,还可以对不同页面实现不同的分享配置
本例结合隐式路由,可实现全局控制所有页面的分享配置,包括全局分享、页面默认分享、页面自定义分享,如下图所示:
如上,一部分页面可以进行自定义分享,另一部分进行页面默认分享(相当于页面开启分享功能,但是没有进行配置),其他大部分页面都进行全局分享配置。
示例代码:
1 // app.js 2 /** 3 * 全局分享配置,页面无需开启分享 4 * 使用隐式页面函数进行页面分享配置 5 * 使用隐式路由获取当前页面路由,并根据路由来进行全局分享、自定义分享 6 */ 7 ! function () { 8 //获取页面配置并进行页面分享配置 9 var PageTmp = Page 10 Page = function (pageConfig) { 11 //1. 获取当前页面路由 12 let routerUrl = "" 13 wx.onAppRoute(function (res) { 14 //app.js中需要在隐式路由中才能用getCurrentPages()获取到页面路由 15 let pages = getCurrentPages(), 16 view = pages[pages.length - 1]; 17 routerUrl = view.route 18 }) 19 20 //2. 全局开启分享配置 21 pageConfig = Object.assign({ 22 onShareAppMessage: function () { 23 //根据不同路由设置不同分享内容(微信小程序分享自带参数,如非特例,不需配置分享路径) 24 let shareInfo={} 25 let noGlobalSharePages=["index/index"] 26 //全局分享配置,如部分页面需要页面默认分享或自定义分享可以单独判断处理 27 if (!routerUrl.includes(noGlobalSharePages)){ 28 shareInfo = { 29 title: "自定义全局分享", 30 imageUrl: wx.getStorageSync("shareUrl") 31 } 32 } 33 return shareInfo 34 } 35 }, pageConfig); 36 // 配置页面模板 37 PageTmp(pageConfig); 38 } 39 }();
如上,无需页面开启和配置,只需要在app.js中编写以上代码,即可对所有页面进行自定义分享配置,从此无需再去页面开启、配置分享转发。
注意事项:
1.本例中使用了 getCurrentPages() 函数获取页面路由,但是app.js中需要放在隐式路由 wx.onAppRoute() 的回调中才能获取到;
2.使用本例方法,无需页面中配置 onShareAppMessage() ,如页面中配置分享事件函数,则会覆盖全局分享。
个人原创博客,转载请注明来源地址:https://www.cnblogs.com/xyyt
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
2019-04-01 编写高效的 CSS 选择器