Adam
Adam

Reputation: 20872

React PropTypes with multiple level object

I have a deep object (multi-level) from React Router4 - 'props.match.params.type'. I'm not sure how to do prop validation on such a deep object. I've seen .shape() but I'm not sure if this caters for depth. Any advice would be great... thx

const Register = (props) => {
console.dir(props)
console.log(props.match.params.type)

return (
    <>
        <RegisterMeta />
        <section className="register">
            Register
        </section>
    </>
)
}

Register.propTypes = {
    type: PropTypes.string.isRequired
}

export default React.memo(Register)

thx

Upvotes: 2

Views: 705

Answers (1)

Lu&#239;s
Lu&#239;s

Reputation: 2833

You can indeed use .shape() to define objects like this:

Component.propTypes = {
  objectType: PropTypes.shape({
    stringType1: PropTypes.string.isRequired,
    stringType2: PropTypes.string.isRequired,
    nestedObjectType: PropTypes.shape({
    //... and so on ...
    }).isRequired
  }).isRequired
}

Upvotes: 3

Related Questions