MotX
一个基于中介者模式实现的轻量级应用状态传递和存储的工具,并为多进程或封闭模块之间的通讯问题提供高效的解决方案
Start
npm i motx --save
内置 TypeScript 声明文件
import MotX from 'motx'
const motx = new MotX({
store: {
bean: { count: 1 }
},
channels:[
'change-count'
]
})
motx.subscribe('change-count', (count)=>{
motx.setState('bean', {count})
})
motx.autorun(({bean})=>{
console.log(bean.count)
})
motx.publish('change-count', 2)
console.log(motx.getState('bean').count)
process.on('message', (message)=>{
motx.onReceive(message)
})
import MotX from 'motx'
const worker = ...
const motx = new MotX({
pipes:{
worker(jsonStringifyed) {
worker.send(jsonStringifyed)
}
}
})
motx.pipe('worker').publish('change-count', 3)
work with Vue
In entry
import MotxVue from 'motx/motx-vue'
const motx = new MotxVue({ store: { hello: `hello world ~ ~` } })
Vue.use(motx)
In vue components
<template>
<section>{{ hell }}</section>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import { State } from 'motx/motx-vue'
@Component({})
export default class App extends Vue {
@State('hello')
protected hell
}
</script>
基础概念
Mediator
MotX 基于中介者模式实现消息发布和订阅机制,实现组件间松耦合通讯,订阅和发布都基于特定频道(channel), publish(channel, data1, data2, ...)
subscribe(channel, data1, data2, ...)
为了更好地理解与维护这些 channel,MotX 限制使用 channel 前须先注册
Store & State
MotX 支持缓存全局应用状态,store 用于存储状态树数据,state 是 store 某字段当前状态快照,默认进行对象引用隔离
通过 getState 方法获得指定字段的 state,通过 setState 更改 store 的存储状态
订阅发布的数据不会流入 store,默认也会进行对象引用隔离
Hooks
MotX 作为 '中介',提供三个可以改变发布与更新缓存状态默认流程的钩子,让你可以灵活拓展 '中介' 的能力
Pipe
Motx 通过 pipe 联通多个进程或多个隔离模块,实现多进程或多隔离模块之间相互发布消息,pipe 需要你基于具体应用场景去定义如何传送 motx 消息字符串数据
同一全局上下文含有 name 属性的 MotX 实例可使用 name 作为 pipe 通道名,无需在 MotXOption.pipes 定义
API
MotXOptions
MotXOptions {
name: string;
store: Store;
hooks?: Hooks;
pipes?: {
[pipeName: string]: Pipe;
};
isolate?: boolean;
channels?: string[];
}
Methods
-
publish(channel: string, ...args: any[]): void
发布消息,传递数据,支持多个参数
-
subscribe(channel: string, handler: Handler): void
订阅消息
-
unsubscribe(channel: string, handler?: Handler): void
取消订阅消息
-
getState(fieldName: string): State
获得指定字段的当前状态数据
-
setState(fieldName: string, newState: State, silent?: boolean): void
变更 store
状态,支持 silent
模式,为 true 时将不会自动发布字段变更消息
-
autorun(handler: (rootState: { [key: string]: any; }, isInitRun: boolean) => {}): RemoveAutorunFunction
-
初始同步执行传入的handler,依赖的state变更后异步执行
-
pipe(rule: string): Pipe
返回管道对象,支持publish和setState
通过MotXOption.pipes定义的发送方式,向目标进程发送publish或setState动作相关json字符串
-
onReceive
当前进程或隔离模块接收到其他进程或隔离模块通过管道发送来的数据后,需要执行该方法并将 json 字符串数据传入即可执行对应publish或setState动作
-
dispose()
注销MotX实例