反应道具类型: 对象的形状？

PropTypes.objectOf和 PropTypes.shape有什么区别? 在 道具类型中:

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

对

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

什么时候应该使用 objectOf，什么时候应该使用 shape？

60836 次浏览
小开
最佳答案

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 })
小开

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!


提交答案