reactjs - props - types of proptypes react

Reaccionar propTypes: objectOf vs shape?

Question

¿Cuál es la diferencia entre PropTypes.objectOf y PropTypes.shape ? En los docs :

// An object with property values of a certain type
optionalObjectOf: PropTypes.objectOf(PropTypes.number)

vs

// An object taking on a particular shape
optionalObjectWithShape: PropTypes.shape({
color: PropTypes.string,
fontSize: PropTypes.number
})

¿Cuándo debo usar objectOf y cuándo debo usar shape ?

Answer 1

Solo quería proporcionar un ejemplo dado el siguiente objeto:

{
petStore: {
animals: {
''23'': { name: ''Snuffles'', type: ''dog'', age 13 }
''29'': { name: ''Mittens'', type: ''cat'', age: 7 }
}
}
}

Objeto y forma

Se usa cuando un objeto puede tener diferentes nombres de propiedades, pero un conjunto consistente de propiedades para cada uno:

const animalItemShape = {
name: PropTypes.string,
type: PropTypes.string,
age: PropTypes.number
}
const petStoreShape = {
animals: PropTypes.objectOf(PropTypes.shape(animalItemShape))
}

Como puede ver, animals es un objeto compuesto de múltiples propiedades que se ajustan al tipo animalItemShape .

¡Espero eso ayude!

Answer 2

PropTypes.objectOf se usa al describir un objeto cuyas propiedades son todas del mismo tipo.

const objectOfProp = {
latitude: 37.331706,
longitude: -122.030783
}
// PropTypes.objectOf(PropTypes.number)

PropTypes.shape se usa al describir un objeto cuyas claves se conocen de antemano y pueden representar diferentes tipos.

const shapeProp = {
name: ''Jane'',
age: 25
}
// PropTypes.shape({ name: PropTypes.string, age: PropTypes.number })