삼항 연산자 사용시 false 값이 null이 거나 없을 경우엔 && 사용하기.
ex)
let condition = true;
condition ? 1 : null
->
condition && 123
scss 변수사용 익히기
선언.
@mixin name($width, $height {
width: $width,
height: $height
margin: xxlx;
}
사용은
@include name (2.5rem,2.5rem)
state의 변경함수(set)의 특징
setHeartImagePass(!heartImagePass)
set함수는 비 동기적 특성을 가지고잇음 // 값을 가지고와서 반대로 해줘( 업데이트된 값인지는 알수 없음.)
console.log(heartImagePass); 업데이트가 반영되기까지 시간이 걸려 콘솔 찍어도 원래 값이 나옴.
변화된 값이 즉각 반영되야 할땐 더 안전한 함수형 업데이트 사용 필요
setHeartImagePass(heartImagePass => !heartImagePass);
//업데이트 된 값을 가져와서 => 반대값을 만듬
ex)
setcount(count + 1) 그전 값이 중요하지 않은 경우 ex) 로그인 현재 값만 필요함.
setcount(count => count + 1 ) 그전 값이 중요한 경우 함수형 업데이트 사용
react 배열에선 원본 사용x [...]으로 복사해서 사용하기
ex)
setCommentList(commentList.push(comment)); // x
setCommentList([comment, …commentList]);
컴포넌트 분류 기준
-
재사용성
-
가독성
