일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | ||||||
2 | 3 | 4 | 5 | 6 | 7 | 8 |
9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | 20 | 21 | 22 |
23 | 24 | 25 | 26 | 27 | 28 |
- CSS
- 이벤트루프
- 웹개발
- 멋사
- VAR
- 메소드체이닝
- Let
- for문
- 배열
- react
- 리액트
- frontend
- JavaScript
- 코딩
- 반복문
- 자바스크립트
- 제주코딩베이스캠프
- 프론트엔드
- useState
- array
- 비동기
- 타입스크립트
- 네트워크
- 멋쟁이사자처럼
- 국비지원
- likelion
- 내일배움카드
- SS
- 화살표함수
- 개발자
- Today
- Total
목록useState 2
Ch.Covelope
![](http://i1.daumcdn.net/thumb/C250x250/?fname=https://blog.kakaocdn.net/dn/dfuVhm/btsvx4LkJTA/Ir8sauWls3FfyznIJrjxOK/img.webp)
리액트에서 함수형 컴포넌트 이전 클래스형 컴포넌트 사용시에는 상태를 지역변수 state에 정의하고 상태를 변경할 메소드 안에 setState 메소드를 넣어서 상태를 변경 했다. 그럼 왜 state변수를 직접 변경하지 않고 setState를 통해서 했는지는 해당 메소드를 사용해서 리액트 컴포넌트에 상태변경에 대해서 알려주고 리렌더링을 요청 하기 위해서다. 함수형 컴포넌트 리액트 함수형 컴포넌트에서는 useState 라는 React Hooks를 사용해서 상태를 관리한다. 해당 훅은 초기값을 받아서 [state, setState] 의 배열을 반환하며 [상태, 상태 변경 핸들러] 로 보면 된다. 함수형 컴포넌트는 렌더가 필요 할 때마다 함수를 재호출 하는데 렌더링은 곧 함수 호출이다. 함수가 재호출 되었을때 이..
![](http://i1.daumcdn.net/thumb/C250x250/?fname=https://blog.kakaocdn.net/dn/bvM2AY/btrvPLdE4b0/yhJSAmCuODsXCLQVKqgJkk/img.png)
리액트 훅 (React hook) 간단 정리 리액트에서는 리렌더링 되는 조건들이 있는데 1. 부모 컴포넌트가 렌더링 되면 그에 해당하는 자식 컴포넌트들은 모두 리렌더링 된다. 2. state (상태) 가 변경되면 리렌더링 된다. 3. props 가 변경되면 리렌더링 된다. useState useState()가 호출되면 배열을 반환한다, [상태 값, 상태를 업데이트하는 함수] 렌더링과 관련된 상태를 관리하는 훅 state 가 갱신되면 리렌더링 된다 useState의 인자로 state의 초기값을 받을 수 있다. useEffect useEffect(function, deps) 부가 효과(side effect/부작용이지만 부가 작용 부가 효과가 더 맞는 거 같다.)를 수행하기 위한 훅 컴포넌트가 렌더링 될 때마..