javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-15 17:42:15 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(react): remove hardware back button event listener when NavManager is unmounted (#23224)

Browse Source 
resolves #23170
This commit is contained in:
William Martin
2021-04-28 17:47:33 -04:00
committed by GitHub
parent f2f41e2af4
commit c501da73be
2 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react-router/test-app/cypress/support/commands.js vendored
View File

@ -123,3 +123,7 @@ Cypress.Commands.add('ionMenuClick', () => {
// .click()
// cy.get('ion-menu.show-menu').should('exist');
});
Cypress.Commands.add('ionHardwareBackEvent', () => {
cy.document().trigger('backbutton');
});

30
packages/react/src/routing/NavManager.tsx
View File

@ -33,6 +33,8 @@ interface NavManagerProps {
}
export class NavManager extends React.PureComponent<NavManagerProps, NavContextState> {
_isMounted = false;
ionRouterContextValue: IonRouterContextState = {
push: (
pathname: string,
@ -68,15 +70,31 @@ export class NavManager extends React.PureComponent<NavManagerProps, NavContextS
};
if (typeof document !== 'undefined') {
document.addEventListener('ionBackButton', (e: any) => {
e.detail.register(0, (processNextHandler: () => void) => {
this.nativeGoBack();
processNextHandler();
});
});
this.handleHardwareBackButton = this.handleHardwareBackButton.bind(this);
document.addEventListener('ionBackButton', this.handleHardwareBackButton);
}
}
componentDidMount() {
this._isMounted = true;
}
componentWillUnmount() {
if (typeof document !== 'undefined') {
document.removeEventListener('ionBackButton', this.handleHardwareBackButton);
this._isMounted = false;
}
}
handleHardwareBackButton(e: any) {
e.detail.register(0, (processNextHandler: () => void) => {
if (this._isMounted) {
this.nativeGoBack();
processNextHandler();
}
});
}
goBack(route?: string | RouteInfo, animationBuilder?: AnimationBuilder) {
this.props.onNavigateBack(route, animationBuilder);
}