Elements의 정의와 생김새
Element : 리액트 앱을 구성하는 가장 작은 블록들
Descriptor => Element
화면에 나타나는 내용을 기술하는 자바스크립트 객체
Virtual DOM에 존재하는 Element => React Elements
Browser DOM에 존재하는 Element => DOM Element
그러니까 React Element는 DOM Element의 가상 표현이라고 볼수있다~
그리고 RE는 DE에 비해 많은 정보를 갖고있기 때문에 상대적으로 크고 무겁다.
Element는 화면에 보이는 것들을 기술...
React Element는 JS 객체 형태로 존재한다
불변성을 지님-> 한번 생성하면 수정불가
RE생성코드
일단 props는 엘리먼트의 속성이라고 생각하고 넘어가자 뒤에서 배울거임
허 씨 어렵네;ㅋㅋ
Elements의 특징 및 렌더링 하기
특징 : immutable -> 불변의
한번 생성된 엘리먼트 변경 불가
그렇다면 기존 엘리먼트를 바꾸는게 아니라 새로 만들어서 바꿔치기 하면 댐!
엘리먼트를 생성한 이후에 실제로 화면에 보여주기 위해서는 렌더링을 해야함
그럼 어케 하느냐?
최상단의 돔이 바로 루트돔 노드임
react element -> 이동 -> Browser DOM
그렇다면 렌더링된 Elements를 업데이트 하기는??
매초 새로운 시간을 업데이트하는 틱 함수
=> setInterval 함수를 통해 매초(1000ms)마다 바꿔치기중
불변성이므로 변경하는게 아니라 새 함수를 불러오는 것임
(실습) 시계
매초 셋인터벌은 적용이 되는데 Clock.jsx의
문제가 뭐지;
버전다른건가;
--문제 해결 react 버전이 강의와 달라서 발생한 문제였음~--
