在 MobX 中，如果需要在一个 store 访问另一个 store，通常有几种方法可以实现这一目标。以下是几种常见的做法：
1. 通过构造函数注入依赖
在创建一个 store 实例时，可以把其他需要的 store 作为参数传递进去。这种方式类似于依赖注入，它允许每个 store 在初始化时就可以知道其它的 store。
class StoreA { constructor(storeB) { this.storeB = storeB; } get someData() { return this.storeB.someOtherData; } } class StoreB { someOtherData = "This is some data from StoreB"; } const storeB = new StoreB(); const storeA = new StoreA(storeB);
在上面这个例子中，StoreA 在被创建时接收了 StoreB 的实例作为参数，并将其保存在自己的属性中。这样 StoreA 就可以方便地访问 StoreB 中的数据了。
2. 通过 Root Store 模式
Root Store 模式涉及创建一个主要的 store，通常称为 RootStore，它将包含所有其他子 store 的引用。然后，每个子 store 可以在构造函数中接收 RootStore 实参，并从中访问其他 store。
class StoreA { constructor(rootStore) { this.rootStore = rootStore; } get someData() { return this.rootStore.storeB.someOtherData; } } class StoreB { someOtherData = "This is some data from StoreB"; } class RootStore { constructor() { this.storeB = new StoreB(); this.storeA = new StoreA(this); } } const rootStore = new RootStore();
通过这种方式，所有的 store 都通过 RootStore 连接在一起，每个 store 都能够访问到根 store 中的其他 store 实例。
3. 使用 MobX 的 context
在使用 React 和 MobX 时，可以利用 React 的 context 系统来传递 stores。这对于在 React 组件树中访问 stores 特别有用。
import React, { createContext, useContext } from 'react'; import { useLocalObservable } from 'mobx-react'; const StoreContext = createContext(null); export const StoreProvider = ({ children }) => { const store = useLocalObservable(() => ({ storeA: new StoreA(), storeB: new StoreB(), })); return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>; }; export const useStores = () => useContext(StoreContext);
在组件中使用 useStores 钩子函数，可以访问到 storeA 和 storeB：
const MyComponent = () => { const { storeA, storeB } = useStores(); // 使用 storeA 和 storeB };
这些方法都提供了在不同 store 之间相互访问的方式，每种方式都有其适用场景和利弊。构造函数注入依赖和 Root Store 模式更适合于非 React 或者大型的 React 项目，而 context 方法则是专为 React 设计的。在实际项目中，应根据具体的架构需求和团队习惯选择合适的方法。在MobX中，有几种方法可以在一个store中访问另一个store。下面是常见的几种方法：
1. 通过构造函数注入
一个简单而直接的方法是在创建Store的时候，将其他的Store作为参数传递给它。例如：
class StoreA { constructor(storeB) { this.storeB = storeB; } } class StoreB { // StoreB的方法和属性 } const storeB = new StoreB(); const storeA = new StoreA(storeB);
这种方法的好处是清晰地声明了依赖，而且易于测试，因为你可以很容易地传递mocks或stubs。
2. 使用根store
通常，在较大的应用程序中，你会有一个“根”store，它持有其他所有子store的实例。这样，每个子store都可以通过根store访问其他的store。
class RootStore { constructor() { this.storeA = new StoreA(this); this.storeB = new StoreB(this); } } class StoreA { constructor(rootStore) { this.rootStore = rootStore; } someMethod() { // 直接通过根store访问StoreB的方法或属性 return this.rootStore.storeB.someProperty; } } class StoreB { // StoreB的方法和属性 } const rootStore = new RootStore();
这种方式的好处是每个store都知道如何找到它需要的任何其他store，而不需要额外的引用或配置。
3. 使用Context（React环境下）
如果你的应用是用React开发的，并且你正在使用MobX来管理状态，则可以利用React的Context API来跨组件传递stores。
import React, { createContext, useContext } from 'react'; const StoreContext = createContext(); const StoreProvider = ({ children, store }) => { return ( <StoreContext.Provider value={store}>{children}</StoreContext.Provider> ); }; // 使用自定义hook来访问store const useStores = () => useContext(StoreContext); // 在组件中使用 const MyComponent = () => { const { storeA, storeB } = useStores(); // ... };
在这种情况下，你可以在应用程序的顶部使用一个StoreProvider包装你的组件树，然后在需要的任何地方通过useStores自定义hook访问stores。
4. 使用全局变量或模块
虽然通常不推荐使用全局变量，但在某些简单的应用或快速原型制作中，你可能会选择简单地将stores作为全局变量或导出它们作为模块的一部分，如下所示：
// stores.js export const storeA = new StoreA(); export const storeB = new StoreB(storeA);
然后在需要的地方导入它们：
import { storeA, storeB } from './stores'; // 使用storeB中的方法或属性 storeA.someMethod(storeB.someProperty);
这种方法简单快捷，但在大型应用程序中，它可能导致难以维护的代码和不清晰的依赖关系。
以上是几种在MobX中让store相互访问的方法。根据你的应用程序的具体需求和结构选择合适的方法。