react2 [React] useEffect (parameter, clean-up) ▷ useEffect parameter 유무에 따른 차이 #1 두번째 인자(dependency)가 없는 경우 function App() { const [isOn, setIsOn] = useState(false); useEffect(() => { fetch('http://example.com') .then(res => console.log(res)) }); } : useEffect에 인자를 넣지 않고 생략하면 state가 바뀔때마다(DOM이 변화할때마다) 무조건적으로 해당 effect를 실행 #2 두번째 인자가 빈 배열([])인 경우 function App() { const [isOn, setIsOn] = useState(false); useEffect(() => { fetch('http://example.. 2022. 1. 19. [React] useReducer ▷ useReducer( ) - useState()의 대체 함수로 많이 사용 - useState()보다 상대적으로 복잡하고 많은 데이터를 관리하기 위하여 사용 const [, ] = useReducer(, , ) reducer 함수: 현재 상태의 객체(state)와 수행할 행동 객체(action)을 인자로 받아서 새로운 상태 객체를 반환하는 함수 dispatch 함수: 인자로 reducer 함수에 넘길 행동 객체(type)를 받음, 컴포넌트 내에서 상태 변경을 일으키기 위하여 사용 import ReactDOM from 'react-dom'; import React, { useReducer } from 'react' // count의 초기 state를 0으로 설정 const initialState = {c.. 2022. 1. 19. 이전 1 다음
