Redux React API Does Not Add Submission Properties

Question

I use response-redux to connect React to a Redux repository and use the connect API to add a send component to the component. But the component does not get the submit property. Here is the code to demonstrate the problem I am facing:

"use strict" var React = require('react'); var ReactDOM = require('react-dom'); var Redux = require('redux'); var ReactRedux = require('react-redux'); var Provider = ReactRedux.Provider; function menuManager(state = {count: 0}, action) { switch (action.type) { case 'ADD': return state + 1; case 'REMOVE': return state - 1; default: return state; } } let store = Redux.createStore(menuManager); let TestLab = React.createClass({ onRemove: function(itemRemove) { // this.props.dispatch undefined. this.props.dispatch({type: 'REMOVE'}); }, onAdd: function() { const { dispatch } = this.props // this.props.dispatch undefined. this.props.dispatch({type: 'ADD'}); }, getInitialState: function() { return { count: 0 }; }, render: function() { return ( <div> <p>Total count: { this.state.count }</p> <button type="button" onClick={this.onAdd}>Add Item</button> </div> ); } }); function select(state) { return state; } ReactRedux.connect(select)(TestLab); var target = document.createElement('div'); document.body.appendChild(target); ReactDOM.render(<Provider store={store}><TestLab /></Provider>, target); 

When I try to call "this.props.dispatch", I get the error "this.props.dispatch".

Answer 1

You are not using a connected component, connect() returns a new component .

 TestLab = ReactRedux.connect(select)(TestLab); ReactDOM.render(<Provider store={store}><TestLab /></Provider>, target); 

You will also encounter some other problems, namely: this.state.count instead of this.props.count , and your reducer function is trying to increase or decrease the object, not the whole inside.