728x90 반응형 SMALL React3 React의 state와 props React는 상태(state)와 속성(props)이라는 두 가지 개념을 중심으로 구성된 JavaScript 라이브러리다. props 와 state 는 React 에서 데이터를 다룰 때 사용하는 개념이다. State(상태) React 컴포넌트에서 state는 컴포넌트 내부에서 관리되는 값으로서 변경 가능하다. 이 값은 컴포넌트가 렌더링되는 동안 변할 수 있으며, 변경될 때마다 컴포넌트가 다시 렌더링된다. 즉, React에서 state는 컴포넌트 내에서 관리되는 상태 데이터이며, 컴포넌트 내부에서 변경할 수 있고, 컴포넌트의 렌더링 결과를 결정한다. State 사용 방법 1. State 초기화하기 import React, { Component } from 'react'; class Counter extend.. 2023. 4. 5. React Hooks (useState) 1. useState 정의 useState는 가장 기본적인 hook이며, 함수 컴포넌트에서 가변적인 상태를 가지게 해준다 useState의 기본적인 형태 const [state, setState] = useState(initialState); state를 변수로 사용했고, setState를 이용해서 state 값을 수정할 수 있다. 그리고 만약 state가 원시 데이터타입이 아닌 객체 데이터 타입인 경우에는 불변성을 유지해줘야 한다. 2. 함수형 업데이트 setState의 ( ) 안에 수정할 값이 아니라, 함수를 넣을 수 있다. 그리고 그 함수의 인자에서는 현재의 state을 가져올 수 있고, { } 안에서는 이 값을 변경하는 코드를 작성할 수 있다. // 일반 사용법 setState(number + 1.. 2022. 8. 3. 7월 4주차 WIL - 리액트 State, Props, 리렌더링 발생조건 State 컴포넌트 내부에서 변경될 수 있는 값이다. 리액트에 존재하는 state의 종류는 2가지다. 클래스형 컴포넌트가 가지고 있는 state 함수형 컴포넌트가 useState라는 함수로 사용하는 state 컴포넌트 내부에서 변경하고 싶은 값이 있을 때, state를 활용하면 된다. 클래스형 컴포넌트의 state state의 초기값을 설정할 때 constructor 메서드를 사용하지 않고도 아래와 같이 간편하게 설정할 수 있다. this.setState 함수 사용 시, 인자로 객체 대신 함수를 넘겨줄 수도 있다. setState로 state의 값을 변경한 다음, 다른 특정한 작업을 하고자 할 때에는 setState의 두 번째 파라미터에 콜백 함수(callback function)를 등록하면 된다. 함수.. 2022. 8. 2. 이전 1 다음 728x90 반응형 LIST
