如何验证 ReactJS 中嵌套对象的 PropTypes？

小能豆

如何验证 ReactJS 中嵌套对象的 PropTypes？

javascript

我正在使用数据对象作为 ReactJS 中组件的道具。

<Field data={data} />

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

propTypes: {
  data: React.PropTypes.object
}

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

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

阅读 44

2024-06-03

共1个答案

小能豆

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

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

更新

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

import PropTypes from 'prop-types';    

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

2024-06-03