Как мне убедиться, что мое меню обновляется при входе нового пользователя? Попытка показать правильные элементы (навигация администратора для пользователей-администраторов)

Question

Мой SideMenu.js, в основном, проверяет, является ли пользователь администратором или нет, прежде чем создавать правильные маршруты для рендеринга, моя проблема в том, что когда я выхожу и снова вхожу, он сохраняет то же самое меню от предыдущего пользователя.

Это выглядит примерно так:

class SideMenu extends Component {
constructor () {
super();

this.state = {
  isAdmin: false,
  isLoading: true,
  footer: [
    { label: 'Settings', url: 'settingsUrl', icon: settingsIcon, id: '1' },
    { label: 'Log Out', url: 'logOutUrl', icon: signoutIcon, id: '2' },
  ]
}

this.checkVerification();
}

checkVerification = () => {
var isLoggedIn = Firebase.isLoggedIn();
var isAdmin = Firebase.isAdmin();

Promise.all([ isLoggedIn, isAdmin ]).then((responses) => {
  isLoggedIn = responses[0];
  isAdmin = responses[1];

  if(isLoggedIn){
    if(isAdmin){
      this.setState({
        isAdmin: true,
        isLoading: false,
        routes: [
          { label: 'Screen1', url: 'screenUrl1', icon: screenIcon1, id: '1' },
          { label: 'Screen2', url: 'screenUrl2', icon: screenIcon2,  id: '2' },
          { label: 'AdminScreen3', url: 'screenUrl3', icon: screenIcon3, id: '3' },
        ]
      })
    }else{
      this.setState({
        isLoading: false,
        routes: [
          { label: 'Screen1', url: 'screenUrl1', icon: screenIcon1, id: '1' },
          { label: 'Screen2', url: 'screenUrl2', icon: screenIcon2,  id: '2' },
        ]
      })
    }
  }else{
    this.props.navigation.navigate('Login')
  }
})
}

Затем я отображаю меню в конце:

render () {
const {  isLoading } = this.state;

return(
  <View style={styles.container}>
    {isLoading && this.renderLoading()}
    {!isLoading && this.renderMenu()}
  </View>
)
}

Меню загружается только один раз и никогда не обновляется, когда пользовательВыйти и вернуться с другой учетной записью. Я попробовал несколько проверок в рендеринге бокового меню, но это привело к спаму функций и не работало в любом случае. Затем я нашел сообщение, в котором упоминается использование StackActions.reset, что я и сделал на своем экране входа в систему, который работает, код выглядит следующим образом:

  const resetAction = StackActions.reset({
          index: 0,
          actions: [NavigationActions.navigate({ routeName: 'Init' })],
      });
  this.props.navigation.dispatch(resetAction);

Это работает, но я получаю предупреждение:

'Предупреждение. Невозможно выполнить обновление состояния React для отключенного компонента. Это не работает, но это указывает на утечку памяти в вашем приложении. Чтобы исправить, отмените все подписки и асинхронные задачи в% s.% S ',' метод componentWillUnmount ',' \ n в Login (at SceneView.js: 9)

Какой правильный способ обновлениямое меню для нового пользователя? Я пытался исправить это в течение долгого времени без надлежащего результата. Я не уверен, поможет ли это узнать, что я загружаю SideMenu из моей страницы инициализации:

import { AppRegistry, Dimensions, YellowBox } from 'react-native';
import { createDrawerNavigator , createAppContainer } from 'react-navigation';
import SideMenu from './pages/menu/SideMenu'
import Routes from './Routes';

const DrawerNav = createDrawerNavigator({
  Screen: {
      screen: Routes,
    }
  }, {
    contentComponent: SideMenu,
    drawerWidth: Dimensions.get('window').width/1.7,
    overlayColor: 'rgba(0, 0, 0, 0.7)',
    minSwipeDistance: 5,
});

const Init = createAppContainer(DrawerNav);

export default Init;

Любая помощь будет принята с благодарностью, заранее спасибо.

Answer 1

Я понял это. Прежде всего, у меня была куча обещаний, которые не были выполнены при выходе из системы, которые давали мне ошибки, после правильного их устранения я в итоге изменил свой logOut.js на:

  componentDidMount(){
    Firebase.logOut().then((response) => {
      const resetAction = StackActions.reset({
              index: 0,
              actions: [NavigationActions.navigate({ routeName: 'Login' })],
          });
      this.props.navigation.dispatch(resetAction);
    })
  }

Этоуловка для меня, когда я попробовал это в моем SideMenu.js, когда route == 'LogOut', это дало мне предупреждения. Похоже, что работает таким образом, хотя. Надеюсь, это поможет кому-то бороться с той же проблемой, если столкнется с этим.