전체 글164 dispatch ( { } ), action 객체를 실행. reducer 기록 dispatch ( { } ), {action} 객체를 실행한다. ex) const SET_WINNER = 'SET_WINNER'; const reducer = ( state, action ) => { switch ( action.type ) { case SET_WINNER: //state.winner = action.winner; 이렇게 하면 안됨. return { ...state, // 기존 state spread 후, action 실행. winner : action.winner, } } } const onClickTable = useCallBack( ( ) => { // action객체를 dispatch해서 state를 바꿔준다. dispatch( { type : 'SET WINNER' , winn.. 2019. 10. 17. 클래스와 hooks 라이프사이클 비교. <reminder> memo useEffect는 여러번 사용 가능하다. state마다 efffect를 사용 할 수 있기 때문임. [배열에는 꼭 useEffect를 다시 실행할 값만 넣어야 한다. 관련 없는 state를 넣으면 동작이 이상해진다.] Hooks에서 부모 컴포넌트에서 child 컴포넌트를 가지고 있으면 부모 컴포넌트가 렌더링 될때마다 무조건 child도 무조건 변경된다. 따라서 => memo를 사용한다. memo가 함수 컴포넌트를 감싸준다. props가 바뀌면 리렌더링이 되는데 memo 를 사용하여 감싸줘야 re-rendering을 방지한다. memo를 넣으면 pureComponent 역할을 한다. 렌더링 성능 최적화에도 도움된다. useEffect를 조금 쉽게 이해하는 방법 => componentDidMount com.. 2019. 10. 12. useEffect 간단한 내용. useEffect 세개를 한꺼번에 같이 사용한다. *함수 컴포넌트 안에다 사용. componentDidMount 컴포넌트가 첫 렌더링 된 후, 비동기 요청을 많이 한다. componentDidUpdate componentWillUnmount 2019. 10. 12. 메서드 안에 있는 함수 호출, 함수 최적화 하기. 메서드 안에 함수를 호출 하라는 부분. 화살표 함수 빼서 high order function 사용한다. ex) onClickBtn = (choice) => { } 2019. 10. 12. prev 1 ··· 21 22 23 24 25 26 27 ··· 41 next