
smox 不同于 redux 和 vuex,也不同于 rematch、dva ,它是重熔再生的,状态管理的顶级设计
虽然是革新,但是它仍然以精彩的机制实现了状态管理的 feature:不可变、单 store 等
写这篇文章,起因是来自一条疑问:

这个问题,仿佛只要是用状态管理,就会被问到
各个状态管理,都给出了自己的拆分机制,如 rematch、dva 等的 model,vuex 的 modules
smox 同样,不仅给出了对应的机制,还比以上要精彩一个世纪~
在引出机制之前,我们先还原一下 react 组件
/ class Car1
class App
\ class Car2
如果是通常我们理解的 model 机制的话,可能就是,注册 car1 car2 两个 model,然后塞到全局 store 里
这和组件树是没关系的,你无法描述嵌套行为,也无法真正形成“一颗树”
那,smox 是怎么做呢?很简单,同样是 tree
const state = {
car1: {
// 这里是 car1 的局部状态
},
car2: {
// 这里是 car2 的局部状态
}
//这里是 app 的全局状态
}
刺不刺激……我们将一个全局的 store 拆成一颗状态树,和组件树一一对应
那拆分呢?
模块化的目的就是为了代码拆分,也就是组织代码结构,其实既然能形成状态树,那—— 组件(Class)能拆,状态(Object)当然一样可以拆!
没错,不仅能拆,还能无限的拆,拆到天荒地老!粒度可以说非常完美啦!
那,组件内,拆完组件内,怎么用呢::>_<::
我们拆的是 store ,但是往组件注入的时候,是全局的 store 实例,组件内可以随意拿到这棵树上每一个分支,通过 path
@map({
state: ['counter/count', 'sex'],
actions: ['counter/up', 'counter/down', 'change'],
effects: ['counter/upAsync']
})
以上,比如 counter/count,这个就是 counter 分支上的 count 属性 而 sex 就是全局的 sex 啦~
以上,就是 smox 的 path 机制,其实在此之前,我也写过 model 机制、写过 vuex 的 path 机制,说实话一直不满意的::>_<::
因为这些机制都是常规的封装套路,你的封装能力再强吧,极限也就是 vuex 的程度了
我一直认为,好的架构好的设计去规避大部分的问题,比写大量优质代码去解决大量问题,要好太多
最后,送上 smox 的 github 地址:
欢迎试用与 star !我超贴心的!放心用!高颜值小受提供人工服务!