mobx是一个简单可扩展的状态管理库
基本概念
- state(状态) 状态是驱动应用的数据,像有数据的excel表格
2.derivations(衍生) 任何源自状态并且不会再进一步相互作用的东西。比如用户界面,待办事件的数量,把变化发送到服务端
两种类型的衍生
(1)computed values 是可以使用pure function从state中推导的值,mobx可以自动更新,并且在不在使用时将其优化掉,比如
@computed get completedTodos(){
return this.todos.filter(todo => todo.done)
}
(2)reactions很像computed values,会对state的变化做出反应,例如更新UI
const Todos = observer({todos} =>
<ul>
todos.map( todo =>
<li>{todo.title}</li>
)
</ul>
)
3.actions动作 动作 是任一一段可以改变状态的代码。用户事件、后端数据推送、预定事件、等等。 动作类似于用户在excel单元格中输入一个新的值。
actions可以改变state,并且是唯一改变state的东西
原则
MobX 支持单向数据流,也就是动作改变状态,而状态的改变会更新所有受影响的视图。
当状态改变时,所有衍生都会进行原子级的自动更新,不能观测到中间值。
所有衍生默认的都是同步更新。动作可以在改变状态之后直接安全的检查计算值???
计算值是延迟更新的,不使用的计算值不更新,直到使用时。
所有的计算值都是纯净的,不应该用来改变state
mobx工作流程
事件调用actions,actions可以改变state,并且唯一能改变state的就是action