Rainyjune Blog

Component HTML 요소 집합을 특정 Function으로 정의하여 축약하는 방법. Function의 return() 구문 내에 HTML 요소 집합을 담는다. Function의 이름이 Component명이 된다. Component 문법을 사용하기 적절한 예 반복적인 HTML 요소들을 축약할 때 내용이 큰 페이지를 쓸 때 특정 HTML 요소들이 자주 변경될 때 Fragment 기법 Function에서 하나의 return 내에 동일한 태그를 병렬로 기입해야 하는 경우 해당 태그들을 또다른 태그로 묶어두거나 묶어두는 태그의 용도가 무의미하다고 느껴지면 형태로 묶어둘 수 있다.

setState state의 내용을 변경하는 함수 변경 시 변경 전 state와 변경될 state를 비교하고, 같으면 동작하지 않는다. Array/Object let [arr, setArr] = [1, 2, 3]; arr은 [1, 2, 3] 배열의 위치를 가리킨다. (c의 포인터처럼) arr의 내용을 바꾸려면? setArr( 변경될 state ) 만약 arr의 첫 번째 값인 1을 5로 바꾸고 싶다면? Array/Object의 값 변경 Array/Object는 값 변경시 원본은 유지하는 것이 좋다. 따라서 변경시 copy본을 만들고 새 state를 구성한다. let copy = arr; copy[0] = 5; setArr(copy); // => 변경되지 않는다. 위와 같이 코드를 작성하면 변경되지 않는다...

onClick html요소에 click시 이벤트 처리를 위한 event handler. // 사용법. // onClick={ function } 형태로 호출한다. // 1. function 정의 1 // 2. function 정의 2 { ... } }> // 3. 미리 정의된 function 호출 setState state는 일반 변수처럼 variable=... 형태로 사용하면 안된다. (html 재렌더링 등 state의 특성을 전혀 사용할 수 없음) state 정의시(useState) 사용한 state변경 함수를 호출하여 값을 변경하는데 이를 setState() 라고 함. // state 정의 let [state, setState] = useState(...);