Jieunny의 블로그

Clean up function 본문

React/Nomadcoders

Clean up function

Jieunny 2021. 12. 2. 14:37
  • component 가 destroyed 될때를 알고 싶으면 생성해주는 함수에서 return 해줘야 한다.
import { useEffect, useState } from "react";

function Hello(){
  useEffect(() => {
    console.log("Created :)");
    return () => console.log("destroyed :(");
  }, [])
  return <h1>Hello</h1>
}

function App() {
  const [showing, setShowing] = useState(false);
  const onClick = () => setShowing((prev) => !prev);
  return (
    <div>
      {showing ? <Hello /> : null} 
      <button onClick={onClick}>{showing ? "HIDE" : "SHOW" }</button>
    </div>
  );
  //hide 할땐 숨기는 게 아니라 아예 component를 없애버리는 것.
}
export default App;

'React > Nomadcoders' 카테고리의 다른 글

Coin Tracker  (0) 2021.12.26
Todo-list  (0) 2021.12.02
useEffect  (0) 2021.12.02
Props  (0) 2021.11.29
Minutes to Hours / Km to Miles Converter  (0) 2021.11.25