Реагируйте Навигация: Компонент не размонтируется на поп или кнопку назад # 5775

Question

У меня проблема при переходе из компонента «Домой», который содержит список компаний, и я нажимаю кнопку, чтобы загрузить представление «Компания», данные загружаются, но когда я нажимаю в Android, происходит возврат к «Домашнему», и когдаЯ нажимаю кнопку другой компании, чтобы загрузить ее данные, выполняет рендеринг того же представления с теми же предыдущими данными, что означает, что компонент не обновляется / не монтируется.

Это мои маршруты

const drawerConfig = {
  initialRouteName: 'Home',
  contentComponent: SideMenu,
  drawerWidth: width,
}

const MainDrawerNavigator = createDrawerNavigator(
  {
    Home: {
      screen: Home,
    },
    Company: {
      screen: Company,
    },
    Gifts: {
      screen: Gifts,
    },
    Contact: {
      screen: Contact
    }
  },
  drawerConfig,
);

const InitialStack = createStackNavigator(
  {
    Menu: {
      screen: Menu,
      path: 'menu/',
    }
  },
  {
    initialRouteName: 'Menu',
    headerMode: 'none',
  }
);

const SwitchNavigator = createSwitchNavigator(
  {
    Init: InitialStack,
    App: MainDrawerNavigator,
  },
  {
    initialRouteName: 'Init',
  }
);

const AppContainer = createAppContainer(SwitchNavigator);

export default AppContainer;

Я перемещаюсь из дома в компанию с этим

goToCompany = company => event => {
    this.props.navigation.navigate('Company', {
      company,
    });
  }

И получаю параметры в компании с этим

componentWillMount() {
    this.setState({ companyData: this.props.navigation.getParam('company', {}) });
}

Так что я ожидаюКомпонент компании будет отключен при появлении всплывающих окон или позволит мне изменить состояние компонента Компании при отправке сведений из Home.

Я использую реагировать на навигацию 3.5.1 и Реактивный род 0,59,3

Answer 1

Реактивная нативная навигация не работает как веб.Читайте здесь для более подробной информации.https://reactnavigation.org/docs/en/navigation-lifecycle.html

Когда вы переходите на другой экран, он фактически не отключается.Подробности читайте в документации.

Используйте взамен willFocus.

Answer 2

Вам необходимо использовать метод push объекта навигации.Нажатие заменяет текущий маршрут новым, и навигация выполняет поиск маршрута и, если он не существует, создает новый.

Answer 3

вы можете попробовать componentDidUpdate проверить в документах

componentDidUpdate(prevProps) {
  // Typical usage (don't forget to compare props):
  if (this.props.userID !== prevProps.userID) {
    this.fetchData(this.props.userID);
  }
}