React propTypes: objectOf vs shape?
Just wanted to provide an example given the following object:
{
petStore: {
animals: {
'23': { name: 'Snuffles', type: 'dog', age 13 }
'29': { name: 'Mittens', type: 'cat', age: 7 }
}
}
}
ObjectOf and Shape
Used when an object could have different property names, but a consistent set of properties for each one:
const animalItemShape = {
name: PropTypes.string,
type: PropTypes.string,
age: PropTypes.number
}
const petStoreShape = {
animals: PropTypes.objectOf(PropTypes.shape(animalItemShape))
}
As you can see, animals
is an object composed of multiple properties that each conform to the animalItemShape
type.
Hope it helps!
PropTypes.objectOf
is used when describing an object whose properties are all the same type.
const objectOfProp = {
latitude: 37.331706,
longitude: -122.030783
}
// PropTypes.objectOf(PropTypes.number)
PropTypes.shape
is used when describing an object whose keys are known ahead of time, and may represent different types.
const shapeProp = {
name: 'Jane',
age: 25
}
// PropTypes.shape({ name: PropTypes.string, age: PropTypes.number })