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): don't show back button when not appropriate

Browse Source
This commit is contained in:
Ely Lucas
2019-12-03 15:29:55 -07:00
committed by Ely Lucas
parent 693ae21096
commit b8517781b1
10 changed files with 40 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
packages/react-router/src/ReactRouter/NavManager.tsx
View File

@ -3,6 +3,7 @@ import { NavContext, NavContextState } from '@ionic/react';
import { Location as HistoryLocation, UnregisterCallback } from 'history';
import React from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { StackManager } from './StackManager';
interface NavManagerProps extends RouteComponentProps {

24
packages/react-router/src/ReactRouter/Router.tsx
View File

@ -2,7 +2,7 @@ import { NavDirection } from '@ionic/core';
import { RouterDirection, getConfig } from '@ionic/react';
import { Action as HistoryAction, Location as HistoryLocation, UnregisterCallback } from 'history';
import React from 'react';
import { RouteComponentProps, withRouter, matchPath } from 'react-router-dom';
import { RouteComponentProps, matchPath, withRouter } from 'react-router-dom';
import { generateId, isDevMode } from '../utils';
import { LocationHistory } from '../utils/LocationHistory';
@ -23,7 +23,7 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
activeIonPageId?: string;
currentDirection?: RouterDirection;
locationHistory = new LocationHistory();
routes: { [key: string]: any } = {};
routes: { [key: string]: any; } = {};
constructor(props: RouteComponentProps) {
super(props);
@ -49,10 +49,6 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
});
}
// componentDidMount() {
// this.setActiveView(this.props.location, this.state.action!);
// }
componentDidUpdate(_prevProps: RouteComponentProps, prevState: RouteManagerState) {
// Trigger a page change if the location or action is different
if (this.state.location && prevState.location !== this.state.location || prevState.action !== this.state.action) {
@ -144,12 +140,12 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
leavingView.mount = false;
this.removeOrphanedViews(enteringView, enteringViewStack);
}
leavingViewHtml = enteringView.id === leavingView.id ? leavingView.ionPageElement!.outerHTML : undefined;
leavingViewHtml = enteringView.id === leavingView.id ? leavingView.ionPageElement!.outerHTML : undefined;
} else {
// If there is not a leavingView, then we shouldn't provide a direction
direction = undefined;
}
} else {
enteringView.show = true;
enteringView.mount = true;
@ -176,7 +172,7 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
if (enteringEl) {
// Don't animate from an empty view
const navDirection = leavingEl && leavingEl.innerHTML === '' ? undefined : direction === 'none' ? undefined : direction;
const shouldGoBack = !!enteringView.prevId || !!this.locationHistory.previous();
const shouldGoBack = !!enteringView.prevId;
this.commitView(
enteringEl!,
leavingEl!,
@ -353,9 +349,9 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
const ionRouterOutlet = React.Children.only(routerOutlet) as React.ReactElement;
React.Children.forEach(ionRouterOutlet.props.children, (child: React.ReactElement) => {
for (let routeKey in this.routes) {
for (const routeKey in this.routes) {
const route = this.routes[routeKey];
if (route.props.path == child.props.path) {
if (route.props.path === child.props.path) {
this.routes[routeKey] = child;
}
}
@ -408,11 +404,11 @@ class RouteManager extends React.Component<RouteComponentProps, RouteManagerStat
if (leavingView) {
if (leavingView.id === leavingView.prevId) {
const previousLocation = this.locationHistory.previous();
if(previousLocation) {
if (previousLocation) {
this.handleNavigate('replace', previousLocation.pathname + previousLocation.search, 'back');
} else {
defaultHref && this.handleNavigate('replace', defaultHref, 'back');
}
}
} else {
const { view: enteringView } = this.state.viewStacks.findViewInfoById(leavingView.prevId);
if (enteringView) {
@ -459,7 +455,7 @@ function clonePageElement(leavingViewHtml: string) {
const newEl = document.createElement('div');
newEl.innerHTML = leavingViewHtml;
newEl.classList.add('ion-page-hidden');
newEl.style.zIndex = null;
newEl.style.zIndex = '';
// Remove an existing back button so the new element doesn't get two of them
const ionBackButton = newEl.getElementsByTagName('ion-back-button');
if (ionBackButton[0]) {

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

@ -96,7 +96,7 @@ class StackManagerInner extends React.Component<StackManagerProps, StackManagerS
ref: this.routerOutletEl
};
if(ionRouterOutlet.props.forwardedRef) {
if (ionRouterOutlet.props.forwardedRef) {
ionRouterOutlet.props.forwardedRef.current = this.routerOutletEl;
}
@ -115,7 +115,7 @@ const withContext = (Component: any) => {
<RouteManagerContext.Consumer>
{context => <Component {...props} routeManager={context} />}
</RouteManagerContext.Consumer>
)
}
);
};
export const StackManager = withContext(StackManagerInner);