Question

React中的一个新功能，试图定义PropTypes，但似乎不再起作用：

下面是我的工作方式：

React.PropTypes.func.isRequired

以下是错误消息：

然后这就是我缺少的组件：

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;

Answer 1

取决于您的React版本，PropType可能位于不同的软件包中：https://www.npmjs.com/package/prop-types

import PropTypes from 'prop-types';


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

Answer 2

如the documentation所述，

自从React v15.5起，
React.PropTypes已经转移到另一个包中。请改用prop-types库。

已导入：

import PropTypes from 'prop-types';

该组件仍使用React.PropTypes。

应该是：

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

React.PropTypes.func.isRequired的问题

2 个答案: