004~005. render, construct

PART 1(입문) React.js 시작하기

004. 생명주기 함수 render() 사용하기

• 생명주기 : component의 생성, 변경, 소멸 과정을 뜻한다.
• component의 '생성' 과정 함수 : render(), construct(), getDerivedStateFormProps(), componentDidMount()
• render() : return 되는 html 형식의 코드를 화면에 그려주는 함수. 화면 내용이 변경돼야 할 시점에 자동으로 호출된다.

 

005. 생명주기 함수 constructor(props) 사용하기

class R005_LifecycleEx extends Component { 
//자식 컴포넌트 = 불러와서 사용되는 쪽, 즉 R005_LifecycleEx 파일 자체
	constructor(props) { // 생명주기 함수 중 가장 먼저 실행되며, 처음 한 번만 호출됨
                            // 자식 컴포넌트 constructor
		super(props); // super함수는 가장 위에 호출해야함, 부모한테서 props 받아오는 역할
		this.state = {}; // component 내부에서 사용되는 변수(state)를 선언하고, 
                                 // 부모객체에서 전달받은 변수(props)를 초기화할 때 사용한다.
...
/ / /
import LifecycleEx from './R005_LifecycleEx' 
//부모 컴포넌트 = 다른 파일에서 import해서 사용하는 쪽