I have a component that receives a prop for its size. The prop can be either a string or a number ex: "LARGE" or 17.

Can I let React.PropTypes know that this can be either one or the other in the propTypes validation?

If I don't specify the type I get a warning:

prop type size is invalid; it must be a function, usually from React.PropTypes.

MyComponent.propTypes = {
    size: React.PropTypes
size: PropTypes.oneOfType([

Learn more: Typechecking With PropTypes

  • Thanks for this, I'm getting random errors when run my Jest tests setting static Proptypes in my classes: ReferenceError: oneOfType is not defined — any suggestions? Thanks in advance!! Feb 9 '18 at 21:55
  • are u sure u have correctly imported import PropTypes from 'prop-types'; ? Feb 12 '18 at 11:22
  • hey there Pawel -- yes, this is how we import them: import PropTypes from 'prop-types'; Feb 12 '18 at 16:59
  • 1
    2019 - use PropTypes.oneOf
    – Imdad
    May 9 '19 at 13:33
  • 1
    @Imdad: oneOf is not used for type checking, only to limit the actual value of the property. Thus keep on using PropTypes.oneOfType.
    – ganzpopp
    Jan 13 at 9:18

For documentation purpose, it's better to list the string values that are legal:

size: PropTypes.oneOfType([
    PropTypes.oneOf([ 'SMALL', 'LARGE' ]),
  • This is the way to do it when the prop should be an Enum. You can even provide an Enum to the oneOf method. Jul 29 '20 at 12:49

This might work for you:

height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
  • 2
    While this code may answer the question, providing additional context regarding why and/or how this code answers the question improves its long-term value. Mar 9 '18 at 10:08

Here is pro example of using multi proptypes and single proptype.

import React, { Component } from 'react';
import { string, shape, array, oneOfType } from 'prop-types';

class MyComponent extends Component {
   * Render
  render() {
    const { title, data } = this.props;

    return (
        <br />

 * Define component props
MyComponent.propTypes = {
  data: oneOfType([array, string, shape({})]),
  title: string,

export default MyComponent;

import React from 'react';              <--as normal
import PropTypes from 'prop-types';     <--add this as a second line

    App.propTypes = {
        monkey: PropTypes.string,           <--omit "React."
        cat: PropTypes.number.isRequired    <--omit "React."

    Wrong:  React.PropTypes.string
    Right:  PropTypes.string
  • 16
    Yes, PropTypes lives in its own package now, but that does not answer the question... Oct 31 '17 at 15:10
  • 1
    Completely not relevant to the question
    – jalooc
    Feb 20 '19 at 23:57

Your Answer

