React propTypes:objectOf vs shape?

时间:2017-08-18 20:40:28

标签: reactjs react-proptypes

PropTypes.objectOfPropTypes.shape之间的区别是什么?在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
})

我应该何时使用objectOf,何时应该使用shape

2 个答案:

答案 0 :(得分:83)

在描述属性类型相同的对象时使用

PropTypes.objectOf

const objectOfProp = {
  latitude: 37.331706,
  longitude: -122.030783
}

// PropTypes.objectOf(PropTypes.number)

PropTypes.shape用于描述其键提前知道的对象,并且可能代表不同的类型。

const shapeProp = {
  name: 'Jane',
  age: 25
}

// PropTypes.shape({ name: PropTypes.string, age: PropTypes.number })

答案 1 :(得分:28)

只是想给出一个给出以下对象的例子:

small_array[small_array == 'a'] = 'z'

ObjectOf和Shape

当一个对象具有不同的属性名称,但每个属性名称的一致属性集时使用:

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

如您所见,const animalItemShape = { name: PropTypes.string, type: PropTypes.string, age: PropTypes.number } const petStoreShape = { animals: PropTypes.objectOf(PropTypes.shape(animalItemShape)) } 是一个由多个属性组成的对象,每个属性都符合animals类型。

希望它有所帮助!