리덕스 복습 중 헷갈리는 부분

김민지·2020년 7월 27일
0

4-1 react-redux패키지에서 connect를 import하고 export default connect()(Song);으로 통신할 수 있는데 이렇게 해서 끝나는게 아니라

일단 연결이 됐다는 가정하에

4-2의 mapStateToProps 함수로 함수를 만들어 줘야한다. mapStateToProps는 어디서 import 해오는 게 아니라 내가 함수를 만드는 것.
이 mapStateToProps는 store에 있는 값을 가져와서 Song에서 활용할 수 있게 뿌려준다. 그리고 mapStateToProps는 컨벤션 이름이라서 이거일 필요는 없다.
결론적으로 mapStateToProps 인자로 state를 받는다. 이 state는 스토어의 state를 말하는 것이고 이거를 이 컴포넌트의 props로 maping 해주어라 이 뜻임.
이 state는 스토어에 있는 state를 통째로 받는다. (store 객체를 통째로) 그러면 예를 들어 home, user 등등 걔네들이 통째로 들어오는데 그러면 mapStateToProps가 return하는 {songList:state.songList}가 위의 Song에 props로 들어간다.

다시 한번 요약
mapSatateToProps라는 함수가 리덕스 스토어에 있는 state를 통째로 받아서 딱 필요한 거만 어떤 객체에 담아서(return으로 담아서)묶여있는 컴포넌트 여기서는 Song 에 뿌려준다. 그 뿌려주는게 connect임

그래서
props = {
songList: [{}, {}] //<-Song이라는 컴포넌트가 받는게이거
} 이런식으로 들어갈거임

profile
Welcome~!

0개의 댓글