You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
28 lines
1.2 KiB
28 lines
1.2 KiB
// 组合子模块（根组件）
|
|
// 封装统一导出的供业务使用的方法
|
|
|
|
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 }
|