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 является дочерним элементом провайдера тем.,

Answer 2

Я думаю, что использование маршрутизатора повторно отображает весь компонент приложения, поскольку он находится внутри BrowserRouter, и, таким образом, новая функция useReducer вызывается при каждом повторном рендеринге и сбрасывается обратно в исходное состояние, но я думаю, что вы можете изменить объект исходного состояния в функции редуктора , таким образом, даже если компонент перерендерится, состояние будет сохранено в памяти