[ Web ]/React.js
[React.js] Kossie Coder - 9강. 조건 렌더링
HoYoung Kim
2021. 12. 28. 15:34
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>
);
}
강의 링크