mobx--react状态管理器

# toJS - 将一个(observable)对象转换为 javascript 结构 # observable和autorun ```js import { observable, autorun } from 'mobx'; const value = observable(0); const number = observable(100); autorun(() => { console.log(value.get()); }); value.set(1); value.set(2); number.set(101); 只有当变化的值处于autorun中时，autorun中的函数会自动执行 ``` # computer ```js const number = observable(10); const plus = computed(() => number.get() > 0); autorun(() => { console.log(plus.get()); }); number.set(-19); number.set(-1); //plus值仍为false 未发生变化 不会出发autorun函数 number.set(1); const price = observable(199); const number = observable(15); //computed的其它简单例子 const allPrice = computed(() => price.get() * number.get()); //对初始数据进行处理 单价*数量 获取到价格（需要的数据） //顺便一提，computed属性和React Native中的ListView搭配使用很愉快。 ``` # action，runInAction和严格模式（useStrict） ```js // mobx推荐将修改被观测变量的行为放在action中。 // 来看看以下例子: import {observable, action} from 'mobx'; class Store { @observable number = 0; @action add = () => { this.number++; } const newStore = new Store(); newStore.add(); ``` # 项目使用 - 接口 ```js // 注入store中的 @inject("xxx") //引入 xxx.js @observer // 声明可观察变量、状态，只有变量至于可观察状态时才会监听到数据的变化 @observer a=false; // 改变状态 @action issuePopupfun = () => { this.issuePopup = false } // 异步转同步 **异步操作加action 建议对任何修改 observables 或具有副作用的函数使用 (@)action ** =>runInAction 是个简单的工具函数，它接收代码块并在(异步的)动作中执行。这对于即时创建和执行动作非常有用，例如在异步过程中。runInAction(f) 是 action(f)() 的语法糖 ？？？？？？ @action CtlPicData = async () => { // get请求 const { isError, data } = await api.get( `${reqPrefix}/api/signals/CtlPicData`, { // 传递的参数 areaCode, adcode } ) // 不存在错误的情况下 if (!isError) { runInAction(() => { // 改变状态 this.statistics_datas.contrast_data3=data.CtlPicData; }) } } // 接收对应store中，需要使用的函数 const{ store }=this.props.xxx; ```