I was wondering how can I use a n observable from one store inside another store class, for example use userStore inside mapStore.
Now I will show you how I initiate stores and use them in my functional components:
/contexts/index.js
import React from 'react'
import { configure } from 'mobx';
import { UserStore } from '../stores/UserStore.js'
import { MapStore } from '../stores/MapStore.js'
export const storesContext = React.createContext({
userStore: new UserStore(),
mapStore: new MapStore(),
});
configure({ enforceActions: "observed" });
/hooks/use-stores.js
//hooks/use-stores.js
import React from 'react'
import { storesContext } from '../contexts/index.js'
export const useStores = () => React.useContext(storesContext);
Inside my functional components I access like this:
import { useStores } from '@hooks/use-stores';
...
const { mapStore,userStore } = useStores();
An example class, UserStore
export class UserStore
{
constructor()
{
makeAutoObservable(this);
user = false;
}