Context.Provider рендеринга в исходное состояние при маршрутизации между страницами

Question

AppContextProvider оборачивает все компоненты, частные и нет.При входе в систему вызывается диспетчеризация, и информация о пользователе обновляется и отображается в частной панели приложений.Однако при переходе на другой частный маршрут панель приложения возвращается в контекстное состояние по умолчанию.

class App extends Component {
  render() {
    return (
      <AppContextProvider>
        <MuiThemeProvider theme={theme}>
          <CssBaseline />
          <BarSelector isTop={true} className={styles.appBar} />
          <Router />
          <BarSelector isTop={false} className={styles.appBar} />
        </MuiThemeProvider>
      </AppContextProvider>
    );
  }
}

Настройка провайдера контекста.Это вызывается при навигации по маршрутизатору и сбрасывает значение / состояние, даже если диспетчер не вызывается.

import React, { createContext, useReducer } from 'react';
import UserReducer from '../reducers/user';

let initialState = {
  User: {
    FName: 'myfname',
    LName: 'mylname',
  }
}

let AppContext = createContext();

function AppContextProvider(props) {
  console.log(`AppContextProvider !!!!!`);
  let [state, dispatch] = useReducer(UserReducer, initialState);
  return (
    <AppContext.Provider value={{ state, dispatch }}>
      {props.children}
    </AppContext.Provider>
  );
}
export { AppContext, AppContextProvider };

Answer 1

Попробуйте сделать muiThemeProvider первым провайдером.Таким образом, AppContextProvider является дочерним элементом провайдера тем..