Где вызвать addListener в реакции родной
Мы работаем над проектом React Native. В этом мы показываем вкладку, а также боковую панель. Итак, для этой боковой панели мы добавили библиотеку реактивной навигации. Но в Android, если пользователь нажмет кнопку «Назад» на этом устройстве, если ящик откроется, мы должны закрыть его.
Итак, мы добавляем addListener в componentDidMount() и удаляем его в componentWillUnmount().
Но проблема в том, что если я переключусь на другую вкладку и вернусь на предыдущую вкладку, и если мы нажмем кнопку «Назад» устройства, обработчик кнопки «Назад», не вызывающий из-за прослушивателя, будет удален.
Есть ли альтернатива, какой метод будет вызываться всегда, как только мы переключимся на предыдущий экран.
Мы знаем, что componentDidMount будет вызываться только один раз во время запуска этого экрана.
Мы знаем, что можем вызвать метод рендеринга, но мы ожидаем, что вызовем его с хорошей практикой.
And is there any way to make it global way instead of writing call the classes closing drawer.
Код:
componentDidMount() {
BackHandler.addEventListener('backTapped', this.backButtonTap);
}
componentWillUnmount() {
BackHandler.removeEventListener('backTapped', this.backButtonTap);
}
backButtonTap = () => {
navigation.dispatch(DrawerActions.closeDrawer());
}
Какие-либо предложения?
Большое спасибо за ваш быстрый ответ @ChrisG, но я ищу любой другой метод по умолчанию или какое-то свойство, чтобы вызвать это, как это рекомендуется. И есть ли способ сделать это глобальным способом вместо того, чтобы писать вызов закрывающего ящика классов.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я бы предложил использовать собственный прослушиватель жизненного цикла навигации для реакции-навигации, чтобы вы также могли обрабатывать различное поведение кнопки «Назад» на другой странице.
componentDidMount() {
this.willFocusListener = navigation.addListener('willFocus', () => {
BackHandler.addEventListener('backTapped', this.backButtonTap);
});
this.willBlurListener = navigation.addListener('willBlur', () => {
BackHandler.removeEventListener('backTapped', this.backButtonTap);
});
}
componentWillUnmount() {
this.willFocusListener.remove();
this.willBlurListener.remove();
}
Тогда Компонент NavigationEvents тоже может быть полезен
Изменение активной вкладки должно изменить состояние родительского компонента, поэтому вы можете прослушать это изменение и, может быть, снова подключить прослушиватель?