React-Redux的基本用法

 React-Redux 将所有组件分成两大类：UI 组件（presentational component）和容器组件（container component）。

 1. 因为UI组件不含有状态，UI 组件又称为"纯组件"，即它纯函数一样，纯粹由参数决定它的值。

 2. 容器组件：

特征：负责管理数据和业务逻辑，不负责 UI 的呈现
   带有内部状态
        使用 Redux 的 API

React-Redux 规定，所有的 UI 组件都由用户提供，容器组件则是由 React-Redux 自动生成。也就是说，用户负责视觉层，状态管理则是全部交给它。

3. connect（）

Reac-Redux提供的connect（）用于从UI组件生成容器组件。

connect（）的完整api：

import { connect } from 'react-redux'

const VisibleTodoList = connect(
  mapStateToProps,
  mapDispatchToProps
)(TodoList)

上面代码中，connect方法接受两个参数：mapStateToProps和mapDispatchToProps。它们定义了 UI 组件的业务逻辑。前者负责输入逻辑，即将state映射到 UI 组件的参数（props），后者负责输出逻辑，即将用户对 UI 组件的操作映射成 Action。

4.mapStateToProps

mapStateToProps是一个函数。它的作用是建立一个从（外部的）state对象到（UI组件的）props对象的映射关系。

作为函数，mapStateToProps执行后应该返回一个对象，里面的每一个键值对就是一个映射。 

5.mapDispatchToProps

mapDispatchToProps是connect函数的第二个参数，用来建立 UI 组件的参数到store.dispatch方法的映射。也就是说，它定义了哪些用户的操作应该当作 Action，传给 Store。它可以是一个函数，也可以是一个对象。
如果mapDispatchToProps是一个函数，会得到dispatch和ownProps（容器组件的props对象）两个参数。

6.Provider组件

React-Redux 提供Provider组件，可以让容器组件拿到state。

import { Provider } from 'react-redux'
import { createStore } from 'redux'
import todoApp from './reducers'
import App from './components/App'

let store = createStore(todoApp);

render() {
return(
    <Provider store={store}>
              <App />
            </Provider>,
);
}