[JSX] 활용

Sehyeon Park·2022년 5월 17일
0

JSX 규칙

1. 하나의 엘리먼트 안에 모든 엘리먼트가 포함

JSX에서 여러 엘리먼트를 작성하고자 하는경우, 최상위에서 opening tag와 closing tag로 감싸주어야 합니다.

2. 엘리먼트 클래스 사용시, className 으로 표기

React에서 HTML class 속성을 지정하려면 "className"으로 표기해야합니다.

3. JacaScript 표현식 사용 시, 중괄호 ({}) 이용



중괄호를 사용하지 않으면 일반 텍스트로 인식하게 된다.

4. 사용자 정의 컴포넌트는 대문자로 시작

JSX로 작성되면 "대문자"로 시작해야 한다. 만약 소문자로 시작하게 되면 일반적인 HTML엘리먼트로 인식을 하게된다

대문자로 작성된 JSX컴포넌트를 사용자 정의 컴포넌트라고 부른다.

5. 조건부 렌더링에는 삼항연산자를 사용

조건부 렌더링은 if문이 아닌 삼항연산자를 이용해야 한다.

6. 여러개의 HTML 엘리먼트를 표시할때, map() 함수를 이용할것.

react 에서 여러 개의 HTML 엘리먼트를 표시할 때는 "map()" 함수를 사용한다.

map 함수를 사용할때는 반드시 "key" JSX속성을 넣어야 한다.
"key" 속성을 넣지않으면 리스트의 각 항목에 key를 넣어야 한다는 경고가 표시된다.

profile
후회하지 않는 개발자가 되자!

0개의 댓글