상태관리(2)
-
[React.js] useReducer
useReducer란 컴포넌트 내부에 새로운 State를 생성하는 React Hook 모든 useState는 useReducer로 대체 가능 하다. useReducer는 useState와는 다르게 상태 관리 코드를 컴포넌트 외부로 분리할 수 있다. Reducer 문법 import { useReducer } from "react"; //reducer: 변환기 const reducer = (state, action) => { console.log(state, action); if (action.type === "INCREASE") { return state + action.data; } if (action.type === "DECREASE") { return state - action.data; } }; c..
2024.03.20 -
[React.js] State - 상태 관리
State란 현재 가지고 있는 형태나 모양을 정의 변화할 수 있는 동적인 값 리액트의 컴포넌트 들은 상태를 정의 할 수 있느 state를 가질 수 있다. state의 값에 따라 렌더링 되는 UI가 결정된다. 리액트가 state의 상태 변화에 따라 렌더링되는 결과를 바꿀수 있다. 리액트에서 다시 렌더링 되는 것을 리 렌더(Re-Render), 리 렌더링(Re-Rendering) 이라고 한다. 리액트에서는 하나의 컴포넌트에 여러개의 state를 가질 수 있다. import "./App.css"; import { useState } from "react"; function App() { const state = useState(); console.log(state); return ; } export defau..
2024.03.11