PropTypes 验证数组

Question

我有一个数组 object 作为 props 传递，该数组看起来像：

[
  {
    "title": "eat food"
  },
  {
    "title": "Drinks",
    "sub_items": [
      {
        "title": "Beer",
        "isDrinking": true
      }
    ]
  },
  {
    "title": "eat Pizza"
  },
  {
    "title": "Other Drinks",
    "sub_items": [
      {
        "title": "Soda",
        "isDrinking": false
      },
      {
        "title": "Soda",
        "isDrinking": false
      }
    ]
  }
]

我想做的是添加 propTypes 验证，比如

标题：PropTypes.string.isRequired

sub_items : PropTypes.array

sub_items : props 数组内部验证，例如 title sting 和 isDrinking 布尔值。

请注意如何在数组上实现这一点。（ps。我的 reactjs 知识非常有限，所以如果我问一个明显愚蠢的问题，请原谅）

Answer 1

你可以这样写：

PropTypes.arrayOf(PropTypes.shape({
  title: PropTypes.string.isRequired,
  sub_items: PropTypes.arrayOf(PropTypes.shape({
    title: PropTypes.string.isRequired,
    isDrinking: PropTypes.bool.isRequired
  })
})).isRequired

请注意 sub_items 不是必需的，但如果它包含在其中一个对象中，则它必须是定义了 title 和 isDrinking 的对象数组。

PropTypes 验证数组

PropTypes validation array

arrays

reactjs

react-proptypes