React-Redux - 1

React-Redux 의 API, Hooks

1. Provider

React Redux includes a <Provider /> component, which makes the Redux store available to the rest of your app

Provider 는 stroe 에 접근해 state 를 사용 할 수 있게 해준다. / 앱 최상단을 감싸는 부모컴포넌트이다.

import React from 'react'
import ReactDOM from 'react-dom'

import { Provider } from 'react-redux'
import store from './store'

import App from './App'

const rootElement = document.getElementById('root')
ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  rootElement
)

 

2. UseSelector

UseSelector 는 store 의 state 에 접근 할 수 있게 해주는 Hooks 이다.

import { useSelector } from 'react-redux'
const user = useSelector(state => state.user);

 

3. UseDispatch

생성한 action 을 useDispatch 로 만든 dispatch 로 트리거할 수 있다.

import { change_user } from '../modules/user' 
import { useDispatch } from 'react-redux' 
const User = () => { ... const dispatch = useDispatch(); 
dispatch(change_user(user)); ... }