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

refactor(react): look up tabs also by property key (#22823)

Browse Source 
When IonTabBar is wrapped by a functional component or fragment, then IonTabs is unable to find it. This is a rare case, but adding the ability for a function component to manually state that is is an IonTabBar. Same for IonTabButtons.
This commit is contained in:
Adam Bradley
2021-02-01 11:31:33 -06:00
committed by GitHub
parent 697bcf3420
commit fa515eb79b
3 changed files with 16 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/react/src/components/navigation/IonTabs.tsx
View File

@ -95,19 +95,22 @@ export class IonTabs extends React.Component<Props> {
if (child == null || typeof child !== 'object' || !child.hasOwnProperty('type')) {
return;
}
if (child.type === IonRouterOutlet) {
if (child.type === IonRouterOutlet || child.type.isRouterOutlet) {
outlet = React.cloneElement(child, { tabs: true });
} else if (child.type === Fragment && child.props.children[0].type === IonRouterOutlet) {
outlet = child.props.children[0];
}
if (child.type === IonTabBar) {
if (child.type === IonTabBar || child.type.isTabBar) {
const { onIonTabsDidChange, onIonTabsWillChange } = this.props;
tabBar = React.cloneElement(child, {
onIonTabsDidChange,
onIonTabsWillChange,
ref: this.tabBarRef,
});
} else if (child.type === Fragment && child.props.children[1].type === IonTabBar) {
} else if (
child.type === Fragment &&
(child.props.children[1].type === IonTabBar || child.props.children[1].type.isTabBar)
) {
const { onIonTabsDidChange, onIonTabsWillChange } = this.props;
tabBar = React.cloneElement(child.props.children[1], {
onIonTabsDidChange,