I have a chart container that wraps a chart component using react-redux's connect().
The container maps the state to the prop 'data'. However:
Warning: Failed prop type: The prop 'data' is marked as required in 'Connect(Chart)', but its value is 'undefined'.

This occurs _before_ mapStateToProps has even run and before even render has been called, as seen by the console logs, at which point data exists.
If state is undefined, the mapStateToProps function returns an empty array for data, something like this:
function mapStateToProps(state) {
return {
data: state.data || [],
}
}
So my question is why is this warning occurring before any mapping and rendering takes place?
It's clearly wrapped by connect (it's called Connect(Chart)), so the fault would probably lie there?
Any help is appreciated.
My guess is that you are using connect as a decorator, and applying PropTypes definitions to the generated wrapper component instead of the "plain" component. As an example:
@connect(mapState)
class MyComponent extends Component { }
MyComponent.propTypes = {}
You need to ensure that the PropTypes settings are applied to the wrapped component instead. (This is one of several reasons why the Redux team discourages use of connect as a decorator, and encourages the use of it as a function call instead.)
Yes, I was applying propTypes to the container. Thanks.
How would one then "require" a prop in a container which is not used in the component?
Thanks again.
Most helpful comment
My guess is that you are using
connectas a decorator, and applying PropTypes definitions to the generated wrapper component instead of the "plain" component. As an example:You need to ensure that the PropTypes settings are applied to the wrapped component instead. (This is one of several reasons why the Redux team discourages use of
connectas a decorator, and encourages the use of it as a function call instead.)