조건 렌더링

조건에 따른 값변화로 알고 넘어가면 될것같다/

 

전에 사용하던 useState, useEffect를 사용한 코딩이라 익숙해지는데 초점을 잡아야할것 같다

 

 

import React,{useEffect,useState} from 'react';

function App() {
  const[condition,setCondition]=useState(false);    //useState 값으로 condition 초기값 false
  const toggle= ()=> setCondition(!condition);		// toggle 실행시 condition 값 변경
  const renderCondition=condition					//renderCondition 값으로 같다면 true
    ? 'True'
    : 'False'
  return (
      <div className="App">
        <div>
        {renderCondition}
        </div>
      <button onClick={toggle}>button</button>		//버튼 클릭시 toggle 함수
      </div>
  );

  }
export default App;