Typechecking
Property Validation
  • PropTypes.array
  • PropTypes.bool
  • PropTypes.func
  • PropTypes.number
  • PropTypes.object
  • PropTypes.string
  • propTypes is only checked in development mode
  • npm install --save prop-types
    		
    import React from 'react';
    import ReactDOM from 'react-dom';
    import PropTypes from 'prop-types';
    
    class Greeting extends React.Component {
      render() {
        return (
          <h1>Hello, {this.props.name}, {this.props.age}, {this.props.address}</h1>
        );
      }
    }
    
    // default props values
    Greeting.defaultProps = {
      address: '40'
    };
    
    // type checking
    Greeting.propTypes = {
      name: PropTypes.string,
      age: PropTypes.string.isRequired
    };
    
    let names = ['Lin', 'Chen'];
    ReactDOM.render(<Greeting name = {names}
                   address="Valdosta, GA"/>, document.getElementById('root'));
    		
    Warning: Failed prop type: Invalid prop `name` of type `array` supplied to `Greeting`, expected `string`.
    Warning: Failed prop type: The prop `age` is marked as required in `Greeting`, but its value is `undefined`.