I believe you're conflating the concepts of both React and Redux. Props are what you get with React components. The Redux store is not related in any way. react-redux is connecting them, making it easier for you to dispatch actions using Redux's store method, dispatch(). react-redux can also make the store's state available as props, by passing in a function as the first argument to connect() Check out the react-redux docs for more information.
– jabacchettaMar 18 '17 at 6:53

2 Answers
2

Your addTodo component has access to the store's state and methods(e.g, dispatch, getState, etc). So, when you hooked up your React view with the Redux store via the connect method, you had access to store's state and methods.

thank you, I will read about this, but why do we want to extract dispatch ? isn't it enough to extract store ?
– Quoc-Hao TranMar 18 '17 at 6:38

You can't extract the store. react-redux 's Provider component makes the entire redux store available to the components in the hierarchy below via the connect method. So, the component has the store's methods and state merged into its props. To access dispatch , it can access it through this.props.dispatch.
– RowlandMar 18 '17 at 6:56

Note, however, that dispatch is not available on props if you do pass in actions to your connect function. In other words, in the code below, since I'm passing someAction to connect, dispatch() is no longer available on props.

The benefit to this approach, however, is that you now have the "connected" action available on your props that will automatically be dispatched for you when you invoke it.

It's important to note, however, that you must invoke the connected action available on props. If you tried to invoke someAction(), you'd be invoking the raw, imported action — not the connected action available on props. The example given below will NOT update the store.

const MyComponent = (props) => {
// we never destructured someAction off of props
// and we're not invoking props.someAction
// that means we're invoking the raw action that was originally imported
// this raw action is not connected, and won't be automatically dispatched
someAction();
};