@asyncConnect breaks getChildContext?
badtant opened this issue · 5 comments
Hi,
So, I have some routes and one surrounding them.
<Route component={ApplicationContext}>
<Route path="start" component={StartHandler} />
...
</Route>
ApplicationContext sets upp some context for the rest of the app like this:
export default
class ApplicationContext extends React.Component {
getChildContext() {
var state = this.context.store.getState();
var getEnv = function(name) {
return state.env[name];
};
var getAsset = function(assetUrl) {
return state.assets[assetUrl] || assetUrl;
};
return {
location: this.props.location,
getEnv: getEnv,
getAsset: getAsset
};
}
render() {
return (
<ApplicationComponent children={this.props.children} />
);
}
}
ApplicationContext.displayName = 'ApplicationContext';
ApplicationContext.propTypes = {
location: React.PropTypes.object.isRequired
};
ApplicationContext.contextTypes = {
store: React.PropTypes.object.isRequired
};
ApplicationContext.childContextTypes = {
location: React.PropTypes.object,
getEnv: React.PropTypes.func,
getAsset: React.PropTypes.func
};
So far so good. Now I have some general data that I want to load regardless of what route you access. I thought the ApplicationContext could handle this so I added the following:
import {asyncConnect} from 'redux-async-connect';
import {isLoaded, load} from '/reducers/mydata';
@asyncConnect([{
promise: ({store}) => {
if (!isLoaded(store.getState().mydata)) {
return store.dispatch(load());
}
}
}])
export default
class ApplicationContext extends React.Component {
...
Now I get
"TypeError: Cannot read property 'getState' of undefined"
For this line:
var state = this.context.store.getState();
Is this a bug or am I doing this wrong?
Thanks!
To be more specifik. I think it is ApplicationContext.contextTypes that breaks.
@badtant , hi
so far i dont see how this issue can be related to redux-async-connect
Usually such context props is passed from provider in higher components, like react-redux provider does:
https://github.com/sars/appetini-front/blob/appetini/src/client.js#L29
https://github.com/sars/appetini-front/blob/appetini/src/helpers/rootComponent.js#L10
You're right. Closing this...
Thanks!
OK I suppose it was wrong usage of the decorator. How should @asyncConnect
be used if I am not using connect
as a decorator, but rather export default connect(mapStateToProps)(MyContainer)
?