mobx state tree
v7.0.1
从技术上讲，MOBX-State-Tree（也称为MST）是建立在功能性反应性状态库MOBX上的状态容器系统。
这可能对您意义不大，没关系。我会这样解释： MOBX是一种状态管理“引擎”，而MOBX-State-Tree为您的应用程序提供了您所需的结构和常见工具。 MST在大型团队中很有价值，但在您期望代码迅速扩展时，在较小的应用程序中也很有用。而且，如果我们将其与Redux进行比较，MST提供的性能比Redux更高，更少的样板代码！
MOBX是最受欢迎的Redux替代品之一，全球公司（与MOBX-State-Tree一起使用）。 MST在打字稿，反应和反应天然的情况下很好地发挥作用，尤其是与MOBX-REACT-LITE配对时。它支持多家商店，异步动作和副作用，可以为React Apps提供极为有针对性的重新订阅者，等等 - 所有这些都以除MOBX本身以外的零依赖性包装。
注意：您不需要知道如何使用MOBX来使用MST。
请参阅“入门教程”或“遵循Free Egghead.io”课程。
可以在http://mobx-state-tree.js.org/上找到官方文档
没有什么比看一些代码可以感觉到图书馆了。查看该作者的作者和推文列表的这个小示例。
import { types } from "mobx-state-tree" // alternatively: import { t } from "mobx-state-tree"
// Define a couple models
const Author = types . model ( {
id : types . identifier ,
firstName : types . string ,
lastName : types . string
} )
const Tweet = types . model ( {
id : types . identifier ,
author : types . reference ( Author ) , // stores just the `id` reference!
body : types . string ,
timestamp : types . number
} )
// Define a store just like a model
const RootStore = types . model ( {
authors : types . array ( Author ) ,
tweets : types . array ( Tweet )
} )
// Instantiate a couple model instances
const jamon = Author . create ( {
id : "jamon" ,
firstName : "Jamon" ,
lastName : "Holmgren"
} )
const tweet = Tweet . create ( {
id : "1" ,
author : jamon . id , // just the ID needed here
body : "Hello world!" ,
timestamp : Date . now ( )
} )
// Now instantiate the store!
const rootStore = RootStore . create ( {
authors : [ jamon ] ,
tweets : [ tweet ]
} )
// Ready to use in a React component, if that's your target.
import { observer } from "mobx-react-lite"
const MyComponent = observer ( ( props ) => {
return < div > Hello, { rootStore . authors [ 0 ] . firstName } ! </ div >
} )
// Note: since this component is "observed", any changes to rootStore.authors[0].firstName
// will result in a re-render! If you're not using React, you can also "listen" to changes
// using `onSnapshot`: https://mobx-state-tree.js.org/concepts/snapshots 
