Web/React

[React] JSX

어징베 2022. 9. 26. 19:31

JSX란?

JavaScript를 확장한 문법.


JSX에 표현식 포함하기

const name = 'Josh Perez';
const element = <h1>Hello, {name}</h1>;

JSX 속성 정의

어트리뷰트에 따옴표를 이용해 문자열 리터럴을 정의할 수 있다.

const element = <a href="https://www.reactjs.org"> link </a>;

const element = <img src={user.avatarUrl}></img>;

JSX로 자식 정의

const element = (
  <div>
    <h1>Hello!</h1>
    <h2>Good to see you here.</h2>
  </div>
);

 

출처: https://ko.reactjs.org/docs/introducing-jsx.html