MorJS 插件示例 插件源代码示例
- 如果插件需要有设置参数,请务必将
options
的interface
export
出去,方便可能需要集成的使用方引用 - 插件需要声明为一个
class
,同时实现MorJSPlugin
这个interface
- 插件必须要有
apply
函数 - 插件调用方不能保证
apply
函数里面的this
指向,因此建议都class
下面的方法都用箭头函数,避免this
指向问题 hook
里面的监听函数必须用普通函数,因为在hook
调用的时候会动态修改this
指向,指向当前的app
、page
、component
实例
import type { MorJSPlugin, MorJSHooks } from '@morjs/api'
// export 出去,方便使用方集成
export interface IRuntimePluginExampleOptions {}
export default class RuntimePluginExample implements MorJSPlugin {
// 必须要有插件名字
pluginName = 'RuntimePluginExample'
options: IRuntimePluginExampleOptions
/**
* 根据插件特性决定是否需要开放选项配置
*/
constructor(public options: IRuntimePluginExampleOptions = {}) {}
/**
* 必须要有 apply 函数
* class 下面的方法用 arrow function
*/
apply = (hooks: MorJSHooks): void => {
// 注意,这里是 arrow function
// hooks 里面包含上面生命周期列表中的所有hook
// 请用 tap 来做 hook 的事件监听注册
// 传入的插件执行函数必须是 function(){}, 因为会动态修改 this 指向
hooks.appOnLaunch.tap(
this.pluginName,
function (
this: tinyapp.IAppInstance<any>,
options: tinyapp.IAppLaunchOptions
) {
// 这里可以拿到对应生命周期里面的参数
console.log(options)
}
)
}
}