diff --git a/src/App.js b/src/App.js index ce34508..1e044a6 100644 --- a/src/App.js +++ b/src/App.js @@ -20,11 +20,13 @@ import ParentComp from "./components/ParentComp"; import RefsDemo from "./components/RefsDemo1"; import RefDemo2 from "./components/RefDemo2"; import FocusInput from "./components/FocusInput"; +import FRParentInput from "./components/FRParentInput"; function App() { return (
- + + {/* */} {/* */} {/* */} {/* */} diff --git a/src/components/FRInput.js b/src/components/FRInput.js new file mode 100644 index 0000000..81dfeb0 --- /dev/null +++ b/src/components/FRInput.js @@ -0,0 +1,11 @@ +import React from "react"; + +const FRInput = React.forwardRef((props, ref) => { + return ( +
+ +
+ ); +}); + +export default FRInput; diff --git a/src/components/FRParentInput.js b/src/components/FRParentInput.js new file mode 100644 index 0000000..88cb5ef --- /dev/null +++ b/src/components/FRParentInput.js @@ -0,0 +1,24 @@ +import React, { Component } from "react"; +import FRInput from "./FRInput"; + +export class FRParentInput extends Component { + constructor(props) { + super(props); + this.inputRef = React.createRef(); + } + + clickHandler = () => { + this.inputRef.current.focus(); + }; + + render() { + return ( +
+ + +
+ ); + } +} + +export default FRParentInput;