mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 11:41:20 +08:00
feat(react): fixing support for react 19, adding test app for react 19 (#30217)
Issue number: resolves #29991 Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
This commit is contained in:
@ -13,41 +13,45 @@ type Props = LocalJSX.IonTabButton &
|
||||
onPointerDown?: React.PointerEventHandler<HTMLIonTabButtonElement>;
|
||||
onTouchEnd?: React.TouchEventHandler<HTMLIonTabButtonElement>;
|
||||
onTouchMove?: React.TouchEventHandler<HTMLIonTabButtonElement>;
|
||||
children?: React.ReactNode;
|
||||
};
|
||||
|
||||
export const IonTabButton = /*@__PURE__*/ (() =>
|
||||
class extends React.Component<Props> {
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this);
|
||||
}
|
||||
export class IonTabButton extends React.Component<Props> {
|
||||
shouldComponentUpdate(): boolean {
|
||||
return true;
|
||||
}
|
||||
|
||||
handleIonTabButtonClick() {
|
||||
if (this.props.onClick) {
|
||||
this.props.onClick(
|
||||
new CustomEvent('ionTabButtonClick', {
|
||||
detail: {
|
||||
tab: this.props.tab,
|
||||
href: this.props.href,
|
||||
routeOptions: this.props.routerOptions,
|
||||
},
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
constructor(props: Props) {
|
||||
super(props);
|
||||
this.handleIonTabButtonClick = this.handleIonTabButtonClick.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
/**
|
||||
* onClick is excluded from the props, since it has a custom
|
||||
* implementation within IonTabBar.tsx. Calling onClick within this
|
||||
* component would result in duplicate handler calls.
|
||||
*/
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const { onClick, ...rest } = this.props;
|
||||
return <IonTabButtonInner onIonTabButtonClick={this.handleIonTabButtonClick} {...rest}></IonTabButtonInner>;
|
||||
handleIonTabButtonClick() {
|
||||
if (this.props.onClick) {
|
||||
this.props.onClick(
|
||||
new CustomEvent('ionTabButtonClick', {
|
||||
detail: {
|
||||
tab: this.props.tab,
|
||||
href: this.props.href,
|
||||
routeOptions: this.props.routerOptions,
|
||||
},
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
static get displayName() {
|
||||
return 'IonTabButton';
|
||||
}
|
||||
})();
|
||||
render() {
|
||||
/**
|
||||
* onClick is excluded from the props, since it has a custom
|
||||
* implementation within IonTabBar.tsx. Calling onClick within this
|
||||
* component would result in duplicate handler calls.
|
||||
*/
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
const { onClick, ...rest } = this.props;
|
||||
return <IonTabButtonInner onIonTabButtonClick={this.handleIonTabButtonClick} {...rest}></IonTabButtonInner>;
|
||||
}
|
||||
|
||||
static get displayName() {
|
||||
return 'IonTabButton';
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user