I'm trying to connect my stores to the actual app in order to provide data and react to state changes. Sadly though, the store connection seems to be faulty.
@connectToStores
class App extends Component {
static getStores() {
return [CategoryStore, UserStore, LocalizationStore];
}
static getPropsFromStores() {
return {
...CategoryStore.getState(),
...UserStore.getState(),
...LocalizationStore.getState()
};
}
static componentDidConnect(props, context) {
ca.fetchCategories();
la.fetchLocales();
}
The componentDidConnect never gets used when running the project. According to this: https://github.com/altjs/connect-to-stores/issues/6 that function should run as soon as the stores have been connected. I had it working partially putting the action in componentWillMount, but the states aren't updated properly. So I think the store connect isn't set up properly.
I also tried both the ES7 decorator / ES6 normal implementation.
I have no clue why data from the stores isn't properly distributed. any help is more than welcome!
I figured it out. The reason why the props weren't passed down to the childeren due to the following:
I used this to initialize the children:
const children = React.Children.map(this.props.children, (child) => {
return React.cloneElement(child, this.state);
});
Which passes down the state but not the props. hence replacing this.state with this.props worked for me.