생명 주기는 크게 3개로 분류한다.
1. 생성 될 때
처음으로 컴포먼트를 불러와 실제 DOM에 생성하는 단계(=mount한다)
2. 업데이트 할 때
유저의 행동에 의해 DOM의 내용이 바뀌는 단계
3. 제거할 때
화면에서 컴포넌트가 제거될 떄(=unmount한다)
하나의 block이다.
리엑트 공식 홈페이지에서는 클래스형이 아닌 함수형 컴포넌트를 사용하라고 명시했다.
라이프 사이클 메서드는 클래스형 컴포넌트에서만 사용가능하다.
import React from 'react';
import './App.css';
function App() {
const name = 'react';
return <div className = "react">{name}</div>
}
export default App;
import React, {Component} from 'react';
class App extends Component {
render() {
const name = 'react';
return <div className="react">{name}</div>
}
}
export default App;
컴포넌트가 가지고 있는 데이터의 형태로 2가지가 있다.
Component가 가지고 있는 데이터이다.
state의 수정/생성을 자유롭게 가능하다.
Component가 부모Component로부터 받아온 데이터이다.
부모의 State에서 받아온 정보를 말한다.
받아온 정보(=props)는 수정이 불가능하다.