fix(react): fixes swipe to go back regression (#21791)

This commit is contained in:
Ely Lucas
2020-07-21 22:30:44 -06:00
committed by GitHub
parent 4199762d3e
commit a15cd01bc3
11 changed files with 118 additions and 10 deletions

View File

@ -39,9 +39,11 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
locationHistory = new LocationHistory();
viewStack = new ReactRouterViewStack();
routeMangerContextState: RouteManagerContextState = {
canGoBack: () => this.locationHistory.canGoBack(),
clearOutlet: this.viewStack.clear,
getViewItemForTransition: this.viewStack.getViewItemForTransition,
getChildrenToRender: this.viewStack.getChildrenToRender,
goBack: () => this.handleNavigateBack(),
createViewItem: this.viewStack.createViewItem,
findViewItemByRouteInfo: this.viewStack.findViewItemByRouteInfo,
findLeavingViewItemByRouteInfo: this.viewStack.findLeavingViewItemByRouteInfo,

View File

@ -4,7 +4,8 @@ import {
StackContext,
StackContextState,
ViewItem,
generateId
generateId,
getConfig
} from '@ionic/react';
import React from 'react';
import { matchPath } from 'react-router-dom';
@ -38,6 +39,7 @@ export class StackManager extends React.PureComponent<StackManagerProps, StackMa
componentDidMount() {
if (this.routerOutletElement) {
this.setupRouterOutlet(this.routerOutletElement);
// console.log(`SM Mount - ${this.routerOutletElement.id} (${this.id})`);
this.handlePageTransition(this.props.routeInfo);
}
@ -111,6 +113,28 @@ export class StackManager extends React.PureComponent<StackManagerProps, StackMa
this.handlePageTransition(routeInfo);
}
async setupRouterOutlet(routerOutlet: HTMLIonRouterOutletElement) {
const canStart = () => {
const config = getConfig();
const swipeEnabled = config && config.get('swipeBackEnabled', routerOutlet.mode === 'ios');
if (swipeEnabled) {
return this.context.canGoBack();
} else {
return false;
}
};
const onStart = () => {
this.context.goBack();
};
routerOutlet.swipeHandler = {
canStart,
onStart,
onEnd: _shouldContinue => true
};
}
async transitionPage(routeInfo: RouteInfo, enteringViewItem: ViewItem, leavingViewItem?: ViewItem) {
const routerOutlet = this.routerOutletElement!;