My server contains the following code snippet:
<ReactRedux.Provider store={store}><Layout defaultStore={JSON.stringify(store.getState())}/></ReactRedux.Provider>
The <Layout>
component includes more nested components.
Further down in my code, I have a class that looks like this:
import React from 'react';
export default React.createClass({
render: function(){
var classes = [
'js-select-product',
'pseudo-link'
];
if (this.props.selected) {
classes.push('bold');
}
return (
<li className="js-product-selection">
<span onClick={this.props.onClick} className={classes.join(' ')} data-product={this.props.id}>{this.props.name}</span>
</li>
);
}
});
Instead of using this.props.onClick
, I would like to dispatch an event to update the state in a reducer. I've come across some information online regarding context but there seems to be conflicting opinions on whether or not it is being deprecated.
EDIT
I have found mention of this connect method, but I recall reading advice against using connect
in child components.