javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(react): redirect routes should unmount leaving component, fixes #22022 (#22029)

Browse Source
This commit is contained in:
Ely Lucas
2020-09-04 14:56:20 -06:00
committed by GitHub
parent ec7c023873
commit b11e06cec1
5 changed files with 14 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/react-router/src/ReactRouter/IonRouter.tsx
View File

@@ -100,8 +100,6 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
} else {
leavingLocationInfo = this.locationHistory.current();
}
} else if (action === 'REPLACE') {
leavingLocationInfo = this.locationHistory.previous();
} else {
leavingLocationInfo = this.locationHistory.current();
}
@@ -113,7 +111,7 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
this.incomingRouteParams = {
routeAction: 'replace',
routeDirection: 'none',
tab: this.currentTab
tab: this.currentTab //TODO this isn't legit if replacing to a page that is not in the tabs
};
}
if (action === 'POP') {

17
packages/react-router/src/ReactRouter/StackManager.tsx
View File

@@ -65,15 +65,18 @@ export class StackManager extends React.PureComponent<StackManagerProps, StackMa
let enteringViewItem = this.context.findViewItemByRouteInfo(routeInfo, this.id);
const leavingViewItem = this.context.findLeavingViewItemByRouteInfo(routeInfo, this.id);
if (!(routeInfo.routeAction === 'push' && routeInfo.routeDirection === 'forward')) {
const shouldLeavingViewBeRemoved = routeInfo.routeDirection !== 'none' && leavingViewItem && (enteringViewItem !== leavingViewItem);
if (shouldLeavingViewBeRemoved) {
leavingViewItem!.mount = false;
//Check if leavingViewItem should be unmounted
if(leavingViewItem) {
if(routeInfo.routeAction === 'replace') {
leavingViewItem.mount = false;
} else if (!(routeInfo.routeAction === 'push' && routeInfo.routeDirection === 'forward')) {
if(routeInfo.routeDirection !== 'none' && (enteringViewItem !== leavingViewItem)) {
leavingViewItem.mount = false;
}
} else if(routeInfo.routeOptions?.unmount) {
leavingViewItem.mount = false;
}
}
if (leavingViewItem && routeInfo.routeOptions?.unmount) {
leavingViewItem.mount = false;
}
const enteringRoute = matchRoute(this.ionRouterOutlet?.props.children, routeInfo) as React.ReactElement;

2
packages/react-router/test-app/cypress/integration/routing.spec.js
View File

@@ -1,6 +1,6 @@
const port = 3000;
describe('Navigation Tests', () => {
describe('Routing Tests', () => {
// before(() => {
// Cypress.config('userAgent', 'Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1')

2
packages/react-router/test-app/package.json
View File

@@ -8,7 +8,7 @@
"@capacitor/core": "1.5.2",
"@capacitor/ios": "^2.2.0",
"@ionic/core": "^5.3.0-dev.202006121329.e968bd0",
"@ionic/react": "file:../../react/ionic-react-5.3.1.tgz",
"@ionic/react": "file:../../react/ionic-react-5.3.2.tgz",
"@svgr/webpack": "4.3.3",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.4.0",

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

@@ -25,7 +25,7 @@ interface NavManagerProps {
locationHistory: LocationHistory;
}
export class NavManager extends React.Component<NavManagerProps, NavContextState> {
export class NavManager extends React.PureComponent<NavManagerProps, NavContextState> {
ionRouterContextValue: IonRouterContextState = {
push: (pathname: string, routerDirection?: RouterDirection, routeAction?: RouteAction, routerOptions?: RouterOptions, animationBuilder?: AnimationBuilder) => {