React/practise/33.Mobx/7.mobx模块化/index.js

// 组合子模块（根组件）
// 封装统一导出的供业务使用的方法

import React from 'react'
import { ListStore } from "./list.Store";
import { CounterStore } from "./counter.Store"

// 1.声明一个 RootStore
class RootStore {
    constructor() {
        // 对子模块进行实例化操作
        // 将来实例化根 RootStore 的时候，根 RootStore 有两个属性，分别是 CounterStore 和 ListStore，各自对应的值就是导入的子模块实例对象
        this.counterStore = new CounterStore()
        this.listStore = new ListStore()
    }
}

// 实例化操作
  RootStore = new RootStore()

// 使用 react context 机制，完成统一的方法封装
// 通过 Provider value={传递的数据} 的查找机制：当调用 useContext，优先从 Provider value 找，如果找不到，就会 createContext 方法传递过来的默认参数
const context = React.createContext(RootStore)

// 这个方法作用：通过 useContext 拿到 RootStore 实例对象，然后返回，所以只要在业务组件中，调用 useStore()，将获得一个跟实例对象 RootStore
const useStore = () => React.useContext(context)

export { useStore }