2019独角兽企业重金招聘Python工程师标准>>> 
provider 源码
import { Component, Children } from 'react'
import PropTypes from 'prop-types'
import storeShape from '../utils/storeShape'
import warning from '../utils/warning'
let didWarnAboutReceivingStore = false
function warnAboutReceivingStore() {
if (didWarnAboutReceivingStore) {
return
}
didWarnAboutReceivingStore = true
warning(
' does not support changing `store` on the fly. ' +
'It is most likely that you see this error because you updated to ' +
'Redux 2.x and React Redux 2.x which no longer hot reload reducers ' +
'automatically. See https://github.com/reactjs/react-redux/releases/' +
'tag/v2.0.0 for the migration instructions.'
)
}
export default class Provider extends Component {
getChildContext() {
return { store: this.store }
}
constructor(props, context) {
super(props, context)
this.store = props.store
}
render() {
return Children.only(this.props.children)
}
}
if (process.env.NODE_ENV !== 'production') {
Provider.prototype.componentWillReceiveProps = function (nextProps) {
const { store } = this
const { store: nextStore } = nextProps
if (store !== nextStore) {
warnAboutReceivingStore()
}
}
}
Provider.propTypes = {
store: storeShape.isRequired,
children: PropTypes.element.isRequired
}
Provider.childContextTypes = {
store: storeShape.isRequired
} 首先学习react数据传递三种方法，props，state，context
props：一般用于将父组件数据传递到子组件，不能跨组件传递
state：state是内部状态或者局部状态
es6数据解析操作，let {xxx ,xx, x} = this.state;
context: 和props相比，context可以跨组件传递信息
声明context步骤一：
constructor(props, context) {
super(props, context)
this.store = props.store
}
getChildContext() {
return { store: this.store }
}更具react生命周期，首先constructor方法获取属性store，getChildContext()将store放入context中
步骤二：
Provider.propTypes = {
store: storeShape.isRequired,
children: PropTypes.element.isRequired
}验证组件信息
步骤三：
Provider.childContextTypes = {
store: storeShape.isRequired
}声明了childrenContextTypes。如果不声明的话，将无法在组件中使用getChildContext()方法；
获取context：
子树中的任何组件都可以通过定义ContextTypes 去访问它。
connect中通过
Connect.contextTypes = {
store: storeShape
}然后通过constructor获取store
constructor(props, context) {
super(props, context)
this.version = version
this.store = props.store || context.store
const storeState = this.store.getState()
this.state = { storeState }
this.clearCache()
}最后执行render渲染，返回一个react子元素。Children.only是react提供的方法，this.props.children表示的是只有一个root的元素。