CODEWITHSUNDEEP
reactjsreact-proptypes
Steve Bennett
Steve Bennett

Reputation: 126105

Why is this object failing my own PropTypes validation

I have a PropTypes validation as follows:

static propTypes = {
    tileHost: PropTypes.string,
    center: PropTypes.arrayOf(PropTypes.number),
    zoom: PropTypes.number,
    layers: PropTypes.objectOf(PropTypes.exact({
      visible: PropTypes.boolean,
      selected: PropTypes.objectOf(PropTypes.arrayOf(PropTypes.node)),
      onClick: PropTypes.func,
      activeType: PropTypes.string
    })),
    focusBbox: PropTypes.arrayOf(PropTypes.number)
  }

I'm calling it like this:

<Map
      height='350px'
      tileHost='mapbox'
      layers={{
        parcels: {
          visible: true,
          selected: {
            'APN': [apn]
          }
        },
      }}
      focusBbox={bbox}
    />

It looks correct to me, yet this error is thrown:

Warning: Failed prop type: Invalid prop `layers.parcels` key `visible` supplied to `Map`.
Bad object: {
  "visible": true,
  "selected": {
    "APN": [
      "11141327"
    ]
  }
}
Valid keys: [
  "visible",
  "selected",
  "onClick",
  "activeType"
]

Is this a bug in prop-types (15.7.2) or am I doing something wrong?

Upvotes: 1

Views: 92

Answers (1)

Dennis Vash
Dennis Vash

Reputation: 53874

visible property should be PropTypes.bool:

Map.propTypes = {
  layers: PropTypes.objectOf(
    PropTypes.exact({
      // Not PropTypes.boolean
      visible: PropTypes.bool
    })
  )
};

Upvotes: 3

Related Questions