https://blog.csdn.net/weiguang102/article/details/121955438

React-redux中的Provider和connect

Provider 提供器讲解

Provider 是一个提供器，只要使用了这个组件，组件里边的其它所有组件都可以使用 store了，这也是React-redux的核心组件了。

有了 Provider 就可以把 /src/index.js 改写成下面的代码样式。

 1 import React from 'react';
 2 import ReactDOM from 'react-dom';
 3 import TodoList from './TodoList'
 4 
 5 //---------关键代码--------start
 6 import { Provider } from 'react-redux'
 7 import store from './store'
 8 
 9 //声明一个App组件，然后这个组件用Provider进行包裹。
10 const App = (
11     <Provider store={store}>
12         <TodoList />
13     </Provider>
14 )
15 
16 //---------关键代码--------end
17 ReactDOM.render(App, document.getElementById('root'));

写完这个，我们再去浏览器中进行查看，发现代码也是可以完美运行的。

需要注意的是，现在还是用传统方法获取的 store 中的数据。有了 Provider 再获取数据就没有那么麻烦了。

connect 连接器的使用

现在如何简单的获取 store 中数据那？
先打开 TodoList.js 文件，引入connect，它是一个连接器（其实它就是一个方法），有了这个连接器就可以很容易的获得数据了。

// 引入连接器
import {connect} from 'react-redux'

　　

这时候暴露出去的就变成了 connect了。

代码如下：

export default connect(xxx,null)(TodoList);

　　

标签：进阶,connect,连接器,Provider,组件,import,Redux,store
来源： https://www.cnblogs.com/hxy--Tina/p/16594847.html