mobx基本使用

mobx是一个简单可扩展的状态管理库

基本概念

1. 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