隐藏路由回调API wx.onAppRoute，全局定义分享内容

发现微信小程序中存在一个隐藏的路由监听API wx.onAppRoute。通过简单的初始化监听，我们可以在全局范围内捕捉到路由改变的事件，对开发者来说，这无疑是一项实用的功能。

在 app.js 文件中的 App 对象的 onLaunch 方法内，调用自定义的 listenAppRoute 函数进行初始化监听，如下：

// app.js
App({
  onLaunch () {
    this.listenAppRoute()
  },
  listenAppRoute() {
    //监听路由切换
    wx.onAppRoute((e) => {
      console.log('%c [ e ]-17', 'font-size:13px; background:pink; color:#bf2c9f;', e)
    })
  },
})

监听回调中，你可以看到类似这样的输出，展示了路由切换的详细信息：

利用这个API，我们可以实现一些全局功能，例如全局分享：不需要在每个页面定制分享功能，而是可以共享一个分享函数。

实现如下：

// app.js
App({
  onLaunch() {
    this.listenAppRoute()
  },
  listenAppRoute() {
    //监听路由切换
    wx.onAppRoute(() => {
      //获取加载的页面
      const pages = getCurrentPages()
      //获取当前页面的对象
      const currentPage = pages[pages.length - 1]
      if (currentPage.data.isCustomShare) { return }
      currentPage.onShareAppMessage = () => {
        return {
          title: "全局定义的分享",
          path: "/pages/index/index",
          imageUrl: "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg",
        }
      }
    })
  },
})

首页代码： 在首页上的设置中，即使是使用默认的分享配置，依然要声明 onShareAppMessage 方法。如果没有声明，微信平台将不会启用分享按钮，但可以简单地声明一个空方法即可。

// index.js
Page({
  data: {
    nvabarData: {
      showCapsule: 1,
      title: "首页",
      hideHomeBack: true,
    },
  },

  onShareAppMessage() {},


  /** 跳转测试页 */
  handleGoToTestPage() {
    wx.navigateTo({
      url: '/pages/testPage/testPage',
    })
  }
})

测试页代码： 对于需要自定义分享的页面（如测试页面），可以在页面数据中加入 isCustomShare: true 标记，并设置自定义的 onShareAppMessage 方法：

// testPage.js
Page({
  data: {
    nvabarData: {
      showCapsule: 1,
      title: "测试页",
      hideHomeBack: true,
    },
    isCustomShare: true,
  },

  onShareAppMessage() {
    return {
      title: "测试页",
      desc: "我是测试页的自定义分享，区分一下",
      imageUrl: "https://img.yzcdn.cn/vant/logo.png",
      path: "/pages/testPage/testPage",
    }
  }
})

首页 - 默认分享：

测试页 - 自定义分享：