[생활코딩] React - 이벤트 state props 그리고 render 함수

리스트의 각각 링크에는 이벤트를 설치할거다.

---

일단 state설정부터 해보자.

현재 우리가 보고 있는 페이지가 웰컴 페이지인지,

읽기 페이지인지 구분하기 위해서 state에 mode라는 값을 줄거다.

 

리액트에서는 state의 값이 바뀌면 그 state를 가지고 있는 컴퍼넌트에 render함수가 다시 호출된다.

다시 호출됨에 따라서 그 render함수 하위에 있는 컴퍼넌트들도 render함수가 있는데 각각 싹 호출이 된다.

(화면이 다시 그려지는것)

 

render가 하는 역할은 어떤 html을 그릴것인가를 결정한다.

그래서 props나 state가 바뀌면 화면이 다시 그려진다.

---

모드의 값에 따라서 만들어지는 랜더링 결과가 달라지게 조건문을 사용해보겠다.

---

mode가 welcome 이면 state.welcome이 화면에 출력된다.

---

모드가 read라면?

---

 

 

 

 

 

 

 

 

 

 

 

 

※ 본 포스팅은 개인 공부 기록을 목적으로 남긴 글이며 본 사실과 다른 부분이 있다면 과감하게 지적 부탁드립니다.