Redux

〰 Redux

데이터를 보관하기 위한 Redux 설치/셋팅

npm install redux react-redux

❗ 그 다음 redux를 이용한 개발환경을 셋팅하시려면 index.js를 열어 다음과 같이 작성합니다.

import 많은곳;
import {Provider} from 'react-redux';
ReactDOM.render(
  <React.StrictMode>
    <BrowserRouter>
      <Provider>
        <App/>
      </Provider>
    </BrowserRouter>
  </React.StrictMode>

라는걸 import 해오신 다음에
내가 state값 공유를 원하는 컴포넌트를 다 감싸시면 됩니다.

redux에서 state를 하나 만드시려면 createStore()

let store = createStore(()=>{ return [{id : 0, name : '멋진신발', quan : 2}]  })

store에 있는 state 데이터 꺼내쓰는 법

import {connect} from 'react-redux';

function state를props화(state){
  return {
    state : state
  }
}
export default connect(state를props화)(Cart);

1. 데이터사용을 원하는 컴포넌트.js 파일 밑에 function을 하나 만들어줍니다.
2. 그 다음 export default 하던 부분에 connect() 적습니다.
   (connect 함수는 위에서 import 해오셔야합니다)

❗ props 쓰려면 function Cart(props) 이렇게 파라미터 추가해야합니다
그 다음에 필요한 곳에서 아까 등록한 props 이름을 쓰시면 됩니다.

{ props.state[0].name }