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

fix(react): fix refs for controllers, overlays, ionpage, and ionrouteroutlet, fixes #19924 (#20012)

Browse Source
This commit is contained in:
Ely Lucas
2019-11-27 16:08:56 -07:00
committed by Ely Lucas
parent 93bd4afb1d
commit ab0f92e01f
6 changed files with 78 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
packages/react/src/components/IonPage.tsx
View File

@ -3,21 +3,34 @@ import React from 'react';
import { NavContext } from '../contexts/NavContext';
import { IonicReactProps } from './IonicReactProps';
import { createForwardRef } from './utils';
export const IonPage = /*@__PURE__*/(() => class IonPageInternal extends React.Component<React.HTMLAttributes<HTMLElement> & IonicReactProps> {
interface IonPageProps extends IonicReactProps {
}
interface IonPageInternalProps extends IonPageProps {
forwardedRef?: React.RefObject<HTMLDivElement>;
}
class IonPageInternal extends React.Component<IonPageInternalProps> {
context!: React.ContextType<typeof NavContext>;
ref = React.createRef<HTMLDivElement>();
ref: React.RefObject<HTMLDivElement>;// React.createRef<HTMLDivElement>();
constructor(props: IonPageInternalProps) {
super(props);
this.ref = this.props.forwardedRef || React.createRef()
}
componentDidMount() {
if (this.context && this.ref.current) {
if (this.context && this.ref && this.ref.current) {
if (this.context.hasIonicRouter()) {
this.context.registerIonPage(this.ref.current);
}
}
}
}
render() {
const { className, children, ...props } = this.props;
const { className, children, forwardedRef, ...props } = this.props;
return (
<div className={className ? `ion-page ${className}` : 'ion-page'} ref={this.ref} {...props}>
@ -33,4 +46,6 @@ export const IonPage = /*@__PURE__*/(() => class IonPageInternal extends React.C
static get contextType() {
return NavContext;
}
})();
};
export const IonPage = createForwardRef(IonPageInternal, 'IonPage');