처음 만난 리덕스 (Redux) 문서
15.3 useStore()
마지막 Redux와 관련된 hook은 useStore() 훅입니다.
useStore() 훅은 이름 그대로 Redux Store에 접근할 수 있게 해주는 훅입니다.
const store = useStore();
useStore() 훅은 위 코드처럼 별도의 파라미터 없이 그냥 호출해서 사용하면 되는데, 이렇게 호출하면 Redux Store에 대한 reference를 리턴해줍니다.
import { useStore } from 'react-redux';
function PrintStore(props) {
const store = useStore();
return <div>{store.getState()}</div>
}
export default PrintStore;
위 코드는 useStore() 훅을 사용한 예시 코드입니다.
이렇게 useStore() 훅을 사용해서 Redux Store에 대한 reference를 가져오고, store의 getState() 함수를 호출해셔 현재 Redux Store의 Root State 값을 가져올 수 있습니다.
useStore() 훅이 유용하긴 하지만 최대한 사용하지 않는 것이 좋습니다.
왜냐하면 리액트 컴포넌트 내에서 Redux Store에 접근해서 뭔가를 하게 되면, 여러가지 Side Effect가 생길 수 있기 때문이죠.
그래서 Redux Store에서 단순히 State를 가져오는 것이 목적이라면, 앞에서 배운 useSelector() 훅을 사용해서 원하는 state만을 추출해서 사용하는 것이 좋습니다.
마지막 업데이트: 2023년 07월 14일 00시 00분
이 문서의 저작권은 이인제(소플)에 있습니다. 무단 전재와 무단 복제를 금합니다.