关于react.js:mobx安装及其简单使用

装置：

yarn add mobx(独自的 js 文件)
yarn add mobx-react(react 和 mobx 进行绑定)
父组件 数据注入
子组件 获取(任意组件)

新建 store/store.js

import {observable, computed, action, autorun,runInAction} from 'mobx';
// import {observable, computed, action} from 'mobx';
class Store {
    @observable tradeCfg = {'sadf':'sadf'};
    @observable baseInfo = {};
    @observable callback = null;
    @observable token = [
        {
            "id":1,
            "name":"YD"
        },
        {
            "id":2,
            "name":"ETH"
        }
    ];
}

export default Store;

关上 Router.js

第一步：引入 store 文件和 mobx-react
第二步：定义一个对象, 用 Provider 将 App 进行包裹

const stores = {FStore: new FirstStore(),
}

父级注入治理

1、引入 mobx-react Provider
2、引入 store.js

new Store()
引入一个新的 store.js
stores = {newStore: new newStore(),
    newStore1: new newStore1(),
    newStore2: new newStore2(),}

3、Provider 注入 {…store}

任意子页面应用 mobx

1.import {NavLink, withRouter} from ‘react-router-dom’
2.import {observer,inject} from ‘mobx-react’;
3. 在类组件之上
@withRouter
@inject(‘FirstStore’)
@observer

函数组件应用 mobx 后果 hook

1.import {withRouter} from ‘react-router-dom’
2.import {observer, MobXProviderContext, inject} from ‘mobx-react’
3.
function useStores(name) {

return React.useContext(MobXProviderContext)[name]

}