본문 바로가기
리액트

react

by 픠버 2022. 12. 7.

React

데이터를 State(내부상태)  Props(외부로 부터 전달받은 상태)

나타내는 render가 있다.

상태가 변경될때마다 re-render 된다

실제로 변경된 부분만 화면에 업데이트 된다.

 

Componnent(컴포넌트)

 

컴포넌트는 JavaScript의 함수와 유사, react 요소들을 받아 반환 받는다

function App() {
const name = "teawook";
const list = ["우유", "딸기", "바나나"];
return (
<>
<h1 className="orange">{`hello ${name}`}</h1>
<ul>
{list.map(function (item) {
return <li>{item}</li>;
})}
</ul>
</>
);
}

export default App;
함수 컴포넌트
JSX

JSX는 페이스북에서 스펙을 정의한 XML과 비슷한 자바스크립ㅌ 확장 문법이다.

Props 와 State
Popps , State는 컴포넌트에  영향을 미치고 쓰임새가 다르다. 컴포넌트에서 자식 컴포넌트에게 값을 전달 할 때 쓰임

-Props

프로퍼티의 줄임말이고 리액트에서 사용자가 컴포넌트에 전달되어 보관하길 원하는 데이터.

-State

컴포넌트 내부에 존재 , 상태값 변경이 가능

'리액트' 카테고리의 다른 글

투두리스트  (0) 2022.12.14
TodoList 연습  (0) 2022.12.13
리액트  (0) 2022.12.09
리액트  (0) 2022.12.08
React  (0) 2022.12.05