[React] Redux (3), Provider

노유성·2023년 6월 16일
0
post-thumbnail

⭐Provider란

Provider는 React에서 Redux 스토어(store)를 애플리케이션에 제공하기 위해 사용되는 컴포넌트입니다. Redux 스토어를 애플리케이션에 연결하고, 스토어의 상태를 하위 컴포넌트에 전달할 수 있도록 도와줍니다.
Provider 컴포넌트는 React 애플리케이션의 최상위 컴포넌트로 감싸집니다. Provider 컴포넌트는 store prop을 통해 Redux 스토어를 받아와서 애플리케이션의 모든 컴포넌트에 스토어를 제공합니다.
-chatGPT

⭐Provider 사용

 root.render(
  <React.StrictMode>
    <Provider store={store}> // provider
      <App
        value={store.getState()}
        onIncrement={() => store.dispatch({ type: 'INCREMENT' })}
        onDecrement={() => store.dispatch({ type: "DECREMENT" })}
      />
    </Provider>
  </React.StrictMode>
);

위와 같이 App 컴포넌트를 Provider로 감싸주게 되면은 App을 포함한 다른 컴포넌트에서도 store객체를 이용할 수 있다.

Provider는 redux 라이브러리가 아니라 react-redux 라이브러리에서 사용할 수 있기 때문에 react-redux를 설치해주어야 한다.

npm install react-redux --save

profile
풀스택개발자가되고싶습니다:)

0개의 댓글

관련 채용 정보