可以在React Native中坚持MOBX状态树

Question

我正在使用 mobx-state-tree 用于状态管理和 mst-persist 坚持我的数据。问题是，当我重新加载应用程序时，商店的初始数据首先渲染，然后加载持久数据。 因此，每当我想在商店中检查持久数据时，初始数据渲染器首先，我的功能就会基于此运行，当一切都停止渲染我的持久数据渲染器时。 此代码是我问题的简化版本。当应用首先渲染时，我会在控制台中获得“ false”，然后我得到“ true”。即使我评论 settemp（）。 有什么方法可以解决此问题，还是可以使用其他软件包来持续使用MST？

rootstore.ts

import {
  types,
  Instance,
  applySnapshot,
  getSnapshot,
} from 'mobx-state-tree';
import {createContext, useContext} from 'react';
import AsyncStorage from '@react-native-async-storage/async-storage';
import {persist} from 'mst-persist';


const RootStore = types
  .model('RootStore', {
    temp: false,
  })
  .actions(store => ({
    setTemp() {
      applySnapshot(store, {...getSnapshot(store), temp: true});
    },
  }));
  
  let _store: any = null;

export function initializeStore() {
  _store = RootStore.create({});
  persist('@initstore', _store, {
    storage: AsyncStorage,
    jsonify: true,
    whitelist: ['temp'], 
  });

  return _store;
}
export type RootInstance = Instance<typeof RootStore>;
const RootStoreContext = createContext<null | RootInstance>(null);
export const Provider = RootStoreContext.Provider;

export function useStore(): Instance<typeof RootStore> {
  const store = useContext(RootStoreContext);
  if (store === null) {
    throw new Error('Store cannot be null, please add a context provider');
  }
  return store;
}

app.ts

import {initializeStore,Provider} from './src/store/RootStore';

const store = initializeStore();

<Provider value={store}>
  <RootStack /> //the App
</Provider>

初始化屏幕

import {observer} from 'mobx-react-lite';
import {useStore} from '../../store/RootStore';

const InitializeScreen = observer((): JSX.Element => {
  const {setTemp,temp} = useStore();
  useEffect(() => {
    setTemp()
  }, []);

  console.log('init page',temp); // <-- Every time app reloads reneders false then true
  
  
  return (
    <Text>InitializeScreen</Text>
  );
});

export default InitializeScreen;