Setting Default Component Props

Default props can be set when a component is being defined by using the getDefaultProps configuration value.

In the code example below, the Badge component has a default value for the name prop.

source code

Default props will be set on this.props if no prop is sent into the component. You can verify this by the fact that the Badge component instance with no name prop uses the default name 'John Doe'.

Notes

  • The getDefaultProps is invoked once and cached when the component is created.
  • The getDefaultProps is run before any instances are created thus using this.props inside of the getDefaultProps will not work.
  • Any objects returned by getDefaultProps() will be shared across instances, not copied.