对微信小程序的生命周期进行扩展 – Typescript 篇
最近利用业余时间倒腾了一个微信小程序，主要目的是横向比较一些业界小程序平台的架构和做法。因为有在其他平台长期的开发经验，对于小程序的一些机制做了一些辩证的思考。例如，小程序的页面，其实不是一个页面，而只是一个方法构造器，甚至整个应用也都只是一个方法而已。这样的情况下，我们以前学到的很多面向对象的经验，例如继承之类的，在这里通通就没有用武之地了。不可否认这样对于一些新手来说，可能是一个不错的设计。但对于我们这种老炮来说，总是有一种要去改造它的冲动。
于是，我也就开始思考，看看能否对所有的页面做一个通用的功能，而不是每次在每个页面中都去写一遍。例如，很显然几乎所有的小程序，都会有用户个性化的数据。这个数据其实需要到所有的页面，那么到底怎么加载这个数据呢？我们可以在App.OnLaunch中尝试去加载，但一般加载数据的过程都是异步的，又怎么通知到所有页面说数据加载成功了呢？
带着这样的问题，本着能用前人经验就不自己折腾的原则，我在网上搜了一下。下面这一篇文章真是跟我英雄所见略同啊。
https://developers.weixin.qq.com/community/develop/article/doc/000a42cdb744b0c00b99eaaba56813
利用上述文章提到的思路，基本上能实现我的目的。本文是写了一个Typescript的版本，但荣誉属于上面的这位Stephen同学。
我喜欢Typescript, 这不用多说了，至于如何用Typescript 进行微信小程序开发，请参考我的文章 https://www.cnblogs.com/chenxizhang/p/14265729.html
下面上代码，并交待一些用Typescript时特殊的地方。
- 默认情况下，Typescript版本中Page 构造器是不允许修改的，因为它定义时用的是const，你需要手工修改下面这个文件，将其修改为let
- 创建一个pagex.ts 文件，当然你可以起任何你想要的名字
const pagex = (Page: WechatMiniprogram.Page.Constructor): WechatMiniprogram.Page.Constructor => {
return (object: any) => {
const { onLoaded } = object
//由于我们需要重写onLoad这个默认方法，为了让具体页面还可以定义具体的Load逻辑，我们假定页面需要实现一个onLoaded方法
object.onLoad = function (_options: any) {
//读取用户数据
wx.getUserInfo({
success: res => {
if (typeof onLoaded === "function")
//如果用户定义了这个函数的话，就调用它
onLoaded.call(this, res.userInfo)
}
})
}
//重写所有页面的分享逻辑，这样不需要在页面中定义了
object.onShareAppMessage = () => {
return {
title: "转发标题"
}
}
return Page(object)
}
}
const original = Page
Page = pagex(original)
- 将这个扩展代码导入到应用中。这个很简单，只需要在App.ts中导入即可。
- 定义一个页面生命周期的扩展接口，以便提示页面，可以实现onLoaded这个函数
- 在具体页面代码中，用如下的方式实现一个自定义的页面构造器
很多事情都是因为你想去做它，然后你就做到了。不要停止思考和尝试。
