你如何在 ReactJS 中验证嵌套对象的 PropTypes? [英] How do you validate the PropTypes of a nested object in ReactJS?

问题描述

我使用数据对象作为 ReactJS 组件的道具.

I'm using a data object as my props for a component in ReactJS.

<Field data={data} />

我知道验证 PropTypes 对象本身很容易:

I know its easy to validate the PropTypes object itself:

propTypes: {
  data: React.PropTypes.object
}

但是如果我想验证里面的值怎么办?IE.data.id，data.title?

But what if I want to validate the values inside? ie. data.id, data.title?

props[propName]: React.PropTypes.number.required // etc...

推荐答案

您可以使用 React.PropTypes.shape 来验证属性:

You can use React.PropTypes.shape to validate properties:

propTypes: {
    data: React.PropTypes.shape({
      id: React.PropTypes.number.isRequired,
      title: React.PropTypes.string
    })
}

更新

正如@Chris 在评论中指出的那样，从 React 15.5.0 版开始，React.PropTypes 已移至包 prop-types.

As @Chris pointed out in comments, as of React version 15.5.0 React.PropTypes has moved to package prop-types.

import PropTypes from 'prop-types';    

propTypes: {
    data: PropTypes.shape({
      id: PropTypes.number.isRequired,
      title: PropTypes.string
    })
}

更多信息

这篇关于你如何在 ReactJS 中验证嵌套对象的 PropTypes?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！