Mobx （响应式数据流方案get,set拦截）

Mobx与redux 的区别
1,Mobx写法更偏向于OOP
2,对一份数据直接进行修改操作，不需要始终返回一个新的数据
3，并非单一store，可以多store
4,Redux默认以JavaScript原生对象形式存储数据，而Mobx使用可观察对象

用法：
store.js

import {observable} from 'mobx'
1,box方法 ，只能观察简单数据类型
const store = observable.box(true)
2，map方法 ，观察复杂数据类型
const store = observable.map({
    isShow:true,
    list:[],
    roleList:[],
    rightList:[]
})
export default store

使用，在preview.js中

发布
componentDidMount(){
    //设置store中的布尔值
    store.set("isShow",false)
}
componentWillUnmount(){
    store.set('isShow',true)
}

订阅
在DashBoard.js中
import {autorun} from 'mobx'
componentDidMount(){
    this.cancel = autorun(() => {
        this.setState({
            isShow:store.get("isShow")
        })
    })
}
取消订阅
componentWillUnmount(){
    this.cancel() 
}
遇到的问题：
当切换list页面的时候，在网速很慢的情况下，会报错，请求数据是异步操作，
当list被销毁之后，数据才请求回来，然后再一次对状态进行修改
解决的方法：
componentWillUnmount(){
    this.setState = () =>{
        console.log("setState  被hack了")
        //由于javascript解释器在不bai同浏览器支持功能du（zhi尤其是DOM）不同dao，
        //为了能zhuan够使javascript代码能够在不同浏览器下正常shu运行，
        //就需要针对不同浏览器写兼容代码，还所谓的hack就是做这些兼容意思
    }
}