스크랩 ) React Native 부모에서 자식 함수 호출하기

// App.js
import React, { useRef } from "react";
import Child from "./Child";

export default function App() {
  const childRef = useRef();
  return (
    <div className="App">
      <button
        onClick={() => {
          childRef.current.showAlert();
        }}
      >
        버튼 눌러
      </button>
      <Child ref={childRef}></Child>
    </div>
  );
}

// Child.js
import React, { forwardRef, useImperativeHandle } from "react";

const Child = forwardRef((props, ref) => {
  useImperativeHandle(ref, () => ({
    showAlert() {
      alert("hi");
    }
  }));

  return <div>자식임</div>;
});

export default Child;

 

출처 : 

https://velog.io/@taylorkwon92/TIL-%EB%B6%80%EB%AA%A8-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8%EC%97%90%EC%84%9C-%EC%9E%90%EC%8B%9D-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8%EC%9D%98-%ED%95%A8%EC%88%98-%ED%98%B8%EC%B6%9C%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95

TIL - 부모 컴포넌트에서 자식 컴포넌트의 함수 호출하는 방법