微信小程序统一分享,全局接管页面分享消息的一些技巧

本文介绍了如何在微信小程序中实现全局接管分享事件,从而避免在每个页面重复设置分享回调。通过监听页面栈变化并替换分享函数,可以确保所有页面都能统一处理分享。此外,还分享了一个小技巧,即在分享时先跳转到首页,然后根据启动参数决定后续的页面跳转,以提高分享的传播效果。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

前言

最近都在折腾自己的个人内容聚合小程序。除了作为原创专栏,视频教程的聚合。我有什么新的想法,产品创意,最终落地的东西都会放到这个小程序里。

而分享功能非常的重要,当某一个功能或文章打动用户的时候,能把这个小程序分享出去,就能带来裂变传播的效果。

全局接管分享事件

而随着功能越来越多,页面越来越多,每一个页面都需要添加分享的回调方法吗?

onShareAppMessage: function () {
  return {
    title: '分享的标题',
    path: '分享的页面路径'
  }
},

有没有办法能全局统一接管分享呢?写一次,所有页面就都可以分享了。

能!

由于onShareAppMessage是一个函数,在用户点击右上角...时触发,或者<button open-type='share'>时触发。所以我们只要在这之前替换掉这个函数就可以了。

通过wx.onAppRoute(cb)这个方法,我们可以监听到微信小程序页面栈的变化。

//在小程序启动时添加全局路由变化的监听
onLaunch(){
    wx.onAppRoute(()=>{
        console.log('page stack changed');
        console.log(getCurrentPages());
    });
}

onAppRoute会在页面栈改变后被触发,这个时候通过getCurrentPages()方法,我们可以拿到小程序中全部的页面栈。

数组最后一个就是当前页面

图片

现在直接给当前页面这个对象赋值onShareAppMessage即可

var pages = getCurrentPages();
var curPage = pages[pages.length-1];

curPage.onShareAppMessage=()=>{
        return {
                title:"被接管了"
        }
}

再分享时我们就会发现被接管了

图片

获取当前页面的地址

page参数不传的话,默认转发出去就是当前页面的地址。当然通过curPage.route也可以获取该页面地址。

var pages = getCurrentPages();
var curPage = pages[pages.length-1];

curPage.onShareAppMessage=()=>{
    return {
        title:"被接管了",
        page:curPage.route
    }
}

小技巧

如果就这样分享出去,用户打开的时候,就会直接展示这个分享的页面。直接返回,或者左滑屏幕,都会直接退出到聊天界面。用户主动分享一次产生的裂变不容易,我希望这个分享带来的价值最大化,让接到分享的微信用户看到更多页面的话怎么办呢?

永远先进首页,首页检查启动参数后再跳转相关页面

curPage.onShareAppMessage=()=>{
    return {
        title:"被接管了",
        page:"/pages/home/home?url="+curPage.route
    }
}


我叫大帅,一个热爱编程的程序

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大帅老猿

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值