Failed prop type: The prop `actions` is marked as required in `Testing`, but its value is `undefined`

Question

I am creating a simple login form using React and Redux. My app.js is:

import React from \'react\';
import { render } from \'react-dom\';
import Inp         


        

Answer 1

I believe you need to connect your component to redux.

import { connect } from 'react-redux'

 // your code

 export default connect(mapStateToProps, mapDispatchToProps)(Testing)

Don't forget to remove export default from before your class as well.

Edit: Please use setState if you're planning on modifying the local state of a component.

Answer 2

The function handleChange should get only an event as a parameter.
handleChange(e) this event is attached to the target element, so you can access its values via e.target.value;
With that said, do not bind the handlers in the render function. do it in the constructor as it will create a new instance of the handler on each render call. bad for performance. As for the redux flow, you should use connect.
export default connect(mapStateToProps, mapDispatchToProps)(Testing).
EDIT
After another look at your code, beside the fact that you didn't use connect to connect the component to redux, you are mapping a wrong object to mapDispatchToProps.
In this code you are using loginAction:

function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(loginAction, dispatch)
  }
}  

But you never imported it, you used a name import:
import { loginSuccess, loginRequest, login } from '../actions/loginAction';
One possible way to import everything and pass it to mapDispatchToProps is this:
import * as loginAction from '../actions/loginAction';
Another mistake you made is naming this object with different name on propTypes, you named it actions and not loginAction

Testing.propTypes = {
  actions: PropTypes.object.isRequired,

};

You will need the same name:

Testing.propTypes = {
  loginAction: PropTypes.object.isRequired,

};

And again don't forget to connect!!