본문 바로가기
Frontend/ReactJS

[React] 삼항연산자 & map()

by 모너아링 2023. 2. 2.

삼항연산자

react의 render부분에서는 if문을 쓸 수 없기 때문에 삼항연산자로 대신한다.

// 삼항 연산자

function App() {
	const [loading, setLoading] = useState(false);
    
	return (
    	<div>
            { loading 
                ? <div> 로딩중 ... </div>
                : null
            }
        </div>
	);
}
//loading 이 true일 경우 '로딩중 ...', false일 경우 null

map()

for문을 대신하여 array.map() 사용

// map

function App() {
	const arr = [1, 2, 3];
    
	return (
    	<div>
            { arr.map((i) => {
            	return <div>i</div>
            })}
        </div>
	);
}

'Frontend > ReactJS' 카테고리의 다른 글

[React] Fetch & Axios  (0) 2023.02.05
[React] login 여부 확인  (0) 2023.02.03
[React] ver. 17 & 18  (0) 2023.02.02
[React]서버로 데이터 보내기  (0) 2023.01.02
[React] selected  (0) 2022.12.27