본문 바로가기
Dev/React

[React] #6.5 CleanUp

by 코딩삐약 2022. 6. 7.
import { useState, useEffect } from 'react';

function Hello() {
  useEffect(function () { // 기본 버전 
    console.log("hi :)");
    return function () {
      console.log("bye :(");
    };
  }, []);
  useEffect (() => {
    console.log("hi :)");
    return () => console.log("bye :(");
  }, []);
  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>
  );
}

export default App;

 

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

[React] #7.2 Coin Tracker  (0) 2022.06.14
[React] #7.1 To Do List  (0) 2022.06.08
[React] #6. useEffect  (0) 2022.05.27
[React] #5. Intro- React App 만들기  (0) 2022.05.27
[React] #4. Props  (0) 2022.05.26