Skip to content

Uncaught TypeError: Cannot convert undefined or null to object #177

@ghost

Description

`import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { loginUser } from '../../actions/authentication';
import Form from 'react-validation/build/form';
import Input from 'react-validation/build/input';
import Button from 'react-validation/build/button';
import {required, email, password} from '../../validations/common.js';
import { Redirect } from 'react-router';

class Login extends Component {

constructor() {
super();
this.state = {
email: '',
password: '',
errors: {}
}
this.handleInputChange = this.handleInputChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}

handleInputChange(e){
this.setState({
[e.target.name]: e.target.value
})
}

handleSubmit(e) {
e.preventDefault()
const user = {
email: this.state.email,
password: this.state.password
}
this.props.loginUser(user)
}

componentWillReceiveProps(nextProps) {
if(nextProps.auth.isAuthenticated) {
this.props.history.push('/')
}
if(nextProps.errors) {
this.setState({
errors: nextProps.errors
});
}
}
componentDidMount() {
if(this.props.auth.isAuthenticated) {
this.props.history.push('/');
}
}
render() {
return (





LOGIN


{this.state.errors.message && (
{this.state.errors.message}
)}
<Form ref={c => { this.form = c }} onSubmit={ this.handleSubmit }>

<Input
type='text'
name='email'
className='form-control'
placeholder='Your Email *'
onChange={ this.handleInputChange }
value={ this.state.email }
ref={c => { this.userInput = c }}
validations={[required, email]}
/>


<Input
type='password'
name='password'
className='form-control'
placeholder='Your Password *'
onChange={ this.handleInputChange }
value={ this.state.password }
validations={[required, password]}
maxLength='12'
minLength='7'
/>


Login


Forget Password?






);
}
}

Login.propTypes = {
auth: PropTypes.object.isRequired,
errors: PropTypes.object.isRequired
}

const mapStateToProps = (state) => ({
auth: state.auth,
errors: state.errors
})

export default connect(mapStateToProps, { loginUser }) (Login)`

Upon leaving the component with the Form/Inputs
form.js:67 Uncaught TypeError: Cannot convert undefined or null to object
at Function.from ()
at i (form.js:67)
at Object._unregister (form.js:154)
at n.value (input.js:177)
at callComponentWillUnmountWithTimer (react-dom.development.js:17932)
at HTMLUnknownElement.callCallback (react-dom.development.js:147)
at Object.invokeGuardedCallbackDev (react-dom.development.js:196)
at invokeGuardedCallback (react-dom.development.js:250)
at safelyCallComponentWillUnmount (react-dom.development.js:17939)
at commitUnmount (react-dom.development.js:18369)
at commitNestedUnmounts (react-dom.development.js:18405)
at unmountHostComponents (react-dom.development.js:18692)
at commitDeletion (react-dom.development.js:18756)
at commitAllHostEffects (react-dom.development.js:19621)
at HTMLUnknownElement.callCallback (react-dom.development.js:147)
at Object.invokeGuardedCallbackDev (react-dom.development.js:196)
at invokeGuardedCallback (react-dom.development.js:250)
at commitRoot (react-dom.development.js:19860)
at react-dom.development.js:21446
at Object.unstable_runWithPriority (scheduler.development.js:255)
at completeRoot (react-dom.development.js:21445)
at performWorkOnRoot (react-dom.development.js:21368)
at performWork (react-dom.development.js:21273)
at performSyncWork (react-dom.development.js:21247)
at interactiveUpdates$1 (react-dom.development.js:21532)
at interactiveUpdates (react-dom.development.js:2268)
at dispatchInteractiveEvent (react-dom.development.js:5086)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions