React propTypes: objectOf vs shape?

Quelle est la différence entre PropTypes.objectOf et PropTypes.shape? Dans le docs:

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

et

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

Quand dois-je utiliser objectOf et quand dois-je utiliser <!--5?

20
demandé sur DMac the Destroyer 2017-08-18 23:40:28

2 réponses

PropTypes.objectOf est utilisé pour décrire un objet dont les propriétés sont toutes du même type.

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

// PropTypes.objectOf(PropTypes.number)

PropTypes.shape est utilisé pour décrire un objet dont les clés sont connues à l'avance, et peut représenter différents types.

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

// PropTypes.shape({ name: PropTypes.string, age: PropTypes.number })
38
répondu djfdev 2018-05-11 23:34:58

voulais Juste vous donner un exemple, compte tenu de l'objet suivant:

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

ObjectOf et de la Forme

Utilisé lorsqu'un objet pourrait avoir différents noms de propriété, mais un ensemble cohérent de propriétés pour chacun d'eux:

const animalItemShape = {
    name: PropTypes.string,
    type: PropTypes.string,
    age: PropTypes.number
}

const petStoreShape = {
    animals: PropTypes.objectOf(PropTypes.shape(animalItemShape))
}

Comme vous pouvez le voir, animals est un objet composé de multiples propriétés qui se conforment chacune à la animalItemShape type.

j'Espère que ça aide!

17
répondu Levi Fuller 2017-11-12 23:29:41