React Native with async Redux state

Question

I have a React Native app and using Redux Toolkit to store application state. It should load state from remote server during init process.

import { configureStore } from '@reduxjs/toolkit'
import counterReducer, {setAmount} from '../reducers/counterSlice';
import tankReducer, {DEFAULT_TANK} from '../reducers/tankSlice';
import logger from 'redux-logger'
import thunk from 'redux-thunk';

const preloadedState = {
  counter: 
  {
    value: 500
  },
  tank:
  {
    currentTank: DEFAULT_TANK,
    tankList: [DEFAULT_TANK]
  }
}

export const store = configureStore({
  reducer: {
    counter: counterReducer,
    tank:  tankReducer
  },
  middleware: (getDefaultMiddleware) => getDefaultMiddleware().concat(logger, thunk),
  preloadedState
})

It works fine with static, but i need get that preloadedState from the server with async request. How to do it? I mean can I somehow force configureStore logic to wait until I get async data from the server? Or where I can put async code which update state immediately after I do configureStore?

React Native with async Redux state

0 Answers