React.js - default prop is not used with `null` is passed

I think there's a distinction between null and undefined that is made when dealing with the defaultProps. The null value could be intended behavior and thus isn't replaced by your defaults, while undefined is not and will be replaced.

As stated in the docs

[...] used to ensure that this.props.value will have a value if it was not specified by the parent component.

Here is a related issue.


  • undefined = nothing.
  • null = something that hints "nothing".

undefined doesn't exist in reality. null however does exist. This means undefined won't pass a prop value as you cannot pass something which doesn't exist. Since null is not nothing, but rather is something which only hints at nothing, it passes in props.


You can change the null value to undefined to use the default value.

<Component bedrooms={bedrooms || undefined} />