how to use proptypes in react functional component code example

Example 1: proptypes oneof

import PropTypes from 'prop-types';

MyComponent.propTypes = {
  // You can declare that a prop is a specific JS type. By default, these
  // are all optional.
  optionalArray: PropTypes.array,
  optionalBool: PropTypes.bool,
  optionalFunc: PropTypes.func,
  optionalNumber: PropTypes.number,
  optionalObject: PropTypes.object,
  optionalString: PropTypes.string,
  optionalSymbol: PropTypes.symbol,

  // An object that could be one of many types
  optionalUnion: PropTypes.oneOfType([
    PropTypes.string,
    PropTypes.number,
    PropTypes.instanceOf(Message)
  ])
};

Example 2: use propTypes in react function

import React from 'react';
import { PropTypes } from 'prop-types';

const student = (props) => {
  return (
    

Student Name: {props.name}

Age: {props.age}

); }; student.propTypes = { name: PropTypes.string, age: PropTypes.number }; export default student;

Example 3: how to make proptypes either or

size: PropTypes.oneOfType([
    PropTypes.number,
    PropTypes.oneOf([ 'SMALL', 'LARGE' ]),
]),

Tags:

Misc Example