React-study28 [DIL] useReducer(1) useReducer(reducer, initialArg, init?)useReducer는 컴포넌트에 reducer를 추가할 수 있는 React입니다.const [state, dispatch] = useReducer(reducer, initialArg, init?)컴포넌트의 최상위 레벨에서 useReducer를 호출하여 reducer를 통해 state를 관리 할 수 있다.import { useReducer } from 'react';function reducer(state, action) { // ...}function MyComponent() { const [state, dispatch] = useReducer(reducer, { age: 42 }); // ... 매개변수( Parameters )r.. 2024. 5. 27. [DIL] useState 사용법 컴포넌트에 state 추가하기 컴포넌트의 최상위 레벨에서 useState를 호출하여 하나 이상의 state 변수를 선언한다.import { useState } from 'react';function MyComponent() { const [age, setAge] = useState(42); const [name, setName] = useState('Taylor'); // ...배열 구조 분해를 사용하여 [something, setSomething]과 같은 state 변수의 이름을 지정하는 것이 관례이다. useState는 state 변수는 처음에 제공한 초기 state이다.그리고 상호작용에 반응하여 다른 값으로 변경할 수 있는 set함수이다.화면의 내용을 업데이트하려면 다음 state로 set 함.. 2024. 5. 20. [DIL] useState(2) setSomething(nextState)과 같은 set 함수state를 다른 값으로 업데이트하고 리렌더링 하려면 useState가 반환하는 set함수를 사용하면 된다.여기에는 다음 state를 직접 전달하거나, 이전 state로부터 계산하여 다음 state를 도출하는 함수를 전달할 수도 있다. const [name, setName] = useState('Edward');function handleClick() { setName('Taylor'); setAge(a => a + 1); // ... 매개변수( Parameters )state가 될 값으로 모든 데이터 타입이 허용되지만, 함수에 대해서는 특별한 동작이 있다.함수를 nextState로 전달하면 업데이터 함수로 취급된다. 이 함수는 순수해야 .. 2024. 5. 17. [DIL] useState(1) useState(initialState)란useState는 컴포넌트에 를 추가할 수 있게 해주는 React 훅이다.import { useState } from 'react';function MyComponent() { const [age, setAge] = useState(28); const [name, setName] = useState('Taylor'); const [todos, setTodos] = useState(() => createTodos()); // ... useState를 호출하여 state 변수를 선언하는데배열 구조 분해를 사용하여 [something, setSomething]과 같이 state 변수의 이름을 지정해야 한다.그리고 맨위에는 useState를 꼭 import 해주어.. 2024. 5. 16. 이전 1 2 3 다음
