[React.js] Kossie Coder - 9강. 조건 렌더링

1. 조건에 의한 값 변경

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

function App() {
	const [condition, setCondition] = useState(false);

	const toggle = () => setCondition(!condition);

	useEffect(() => {
		console.log(condition);
	}, [condition]);

	const renderCondition = condition ? 'True' : 'False';

	return (
		<div className="App">
			{/* Toggle 버튼을 통해 state의 condition 값을 바꾸면 renderCondition에 의해 div 태그 내의 문자가 변경됨 */}
			<div>{renderCondition}</div>
			<button onClick={toggle}>Toggle</button>
		</div>
	);
}

---

강의 링크

https://youtu.be/uIisipyyFVg