我一直在关注这里的 ReduxJS 文档：Using with React
在文档的末尾，它提到了提供程序对象的使用，我将我的 App 组件包装在提供程序中，如下所示：
import React from 'react'
import ReactDOM from 'react-dom'
import { createStore } from 'redux'
import { Provider } from 'react-redux'
import RootReducer from './app/reducers'
import App from './app/app'
const store = createStore(RootReducer)
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
)
然而，这就是文档结束的地方。如何在组件内取货提供者提供的商店？
通过组件访问您的商店的最佳方式是使用该connect()功能，如文档中所述。这允许您将状态和动作创建者映射到您的组件，并在您的商店更新时自动传入它们。此外，默认情况下它将dispatch作为this.props.dispatch. 这是文档中的一个示例：
import { connect } from 'react-redux'
import { setVisibilityFilter } from '../actions'
import Link from '../components/Link'
const mapStateToProps = (state, ownProps) => {
return {
active: ownProps.filter === state.visibilityFilter
}
}
const mapDispatchToProps = (dispatch, ownProps) => {
return {
onClick: () => {
dispatch(setVisibilityFilter(ownProps.filter))
}
}
}
const FilterLink = connect(
mapStateToProps,
mapDispatchToProps
)(Link)
export default FilterLink
请注意，connect实际上创建了一个新组件来环绕您现有的组件！这种模式称为高阶组件，通常是在 React 中扩展组件功能的首选方式（通过继承或混合之类的东西）。
由于有它不少性能优化，一般是不太可能导致错误的终极版开发者几乎总是建议使用connect在直接访问商店-但是，如果你有一个非常充分的理由需要更低级别的访问权限，该Provider组件使得所以它的所有孩子都可以通过以下方式访问商店this.context：
class MyComponent {
someMethod() {
doSomethingWith(this.context.store);
}
}
感谢您的回答，但它缺少一个关键的部分，实际上在文档中。
如果未定义 contextTypes，则 context 将是一个空对象。
所以我必须添加以下内容才能为我工作：
static contextTypes = {
store: PropTypes.object.isRequired
}