react-redux

react-redux 是为了更好的将组建跟redux建立连接

Provider 提供器，注入store到组件里面

import { Provider } from 'react-redux'
import store from './store'
// 使用jsx将组件包裹起来
const App = (
    <Provider store={store}>
       <Main />    
    </Provider>
)

ReactDOM.render(App, document.getElementById('root') )

connect连接器，负责连接组件到数据

import { connect } from 'react-redux'
const mapStateToProps = (state) =>{
    return{
        nowInputValue:state.nowInputValue,
        list:state.list
    }
}
// store.dispatch 被映射到了props上
const mapDispatchToProps = (dispatch) =>{
   return{
      changeInputVlaue(e){
          const action = {
              type:'init_state_data',
              value:e.target.value
          }
          dispatch(action)
      }
   }
}

export default connect(mapStateToProps, mapDispatchToProps)(Todo_Redux)

将一个ui组件使用 connect进行连接的时候，最后得到的便是一个容器组件。