Issue with React.PropTypes.func.isRequired

问题

Am new in React and trying to define PropTypes, but seems it's no longer working :

Below is how I was working with it :

React.PropTypes.func.isRequired

Below is the error am getting :

Then this is the component am having what am I missing :

import React, {Component} from 'react';
import {Input,Icon,Row,Card, Button} from 'react-materialize'
import  '../css/signup.css'
import PropTypes from 'prop-types';

class SignUpForm extends Component {

    constructor(props) {
        super(props);
        this.state = {username: '', email:'', password:'', confirm_password:''};

        this.handleChange = this.handleChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

    handleChange(event) {
        this.setState({username: event.target.username});
        this.setState({email: event.target.email});
        this.setState({password: event.target.password});
        this.setState({confirm_password: event.target.confirm_password});


    }

    handleSubmit(event) {
        event.preventDefault();
        this.props.userSignUpRequest(this.state);
    }

    render() {
        return (
            <div>
                <Card className="card-effects right">
                    <form className="card-form-signup" onSubmit={this.handleSubmit}>
                        <Row>
                            <label className="signup-header"><b>Signup to Authors Haven</b></label>
                        </Row>
                        <Row>
                            <Input s={12} placeholder="Username" value={this.state.username} onChange={this.handleChange} validate>
                                <Icon className="icon-styles">account_box</Icon></Input>

                        </Row>
                        <Row>
                            <Input s={12} type='email' value={this.state.email}  onChange={this.handleChange} placeholder="Email"    validate><Icon className="green darken-4">email</Icon></Input>
                        </Row>
                        <Row>
                            <Input s={12} type='password' placeholder="Password"  value={this.state.password} onChange={this.handleChange}  validate>
                                <Icon className="icon-styles">vpn_key</Icon></Input>
                        </Row>
                        <Row>
                            <Input s={12} type='password' placeholder="Confirm password" value={this.state.confirm_password} onChange={this.handleChange} validate>
                                <Icon className="icon-styles">vpn_key</Icon></Input>
                        </Row>
                        <Row>
                            <label >Already have an account ? </label>
                        </Row>

                        <Row>
                            <Button className='button-effects' type="submit" value="Submit" > Signup </Button>
                        </Row>
                    </form>
                </Card>
            </div>


        );
    }

}

SignUpForm.propTypes = {

    userSignUpRequest: React.PropTypes.func.isRequired
}



export default SignUpForm;

回答1:

Depending on your React version PropTypes might be in a different package: https://www.npmjs.com/package/prop-types

import PropTypes from 'prop-types';


SignUpForm.propTypes = {
    userSignUpRequest: PropTypes.func.isRequired
}

回答2:

As the documentation states,

React.PropTypes has moved into a different package since React v15.5. Please use the prop-types library instead.

It's already imported:

import PropTypes from 'prop-types';

While the component still uses React.PropTypes.

It should be:

SignUpForm.propTypes = {
    userSignUpRequest: PropTypes.func.isRequired
}

来源：https://stackoverflow.com/questions/52697963/issue-with-react-proptypes-func-isrequired