对 arrayOf 所需元素的 React PropTypes 验证无法正常工作

Question

空数组 [] 传递了以下 PropTypes 定义，即使我们声明字符串元素是必需的。

{
    a: React.PropTypes.arrayOf(
        React.PropTypes.string.isRequired
    ).isRequired
}

相反，空对象{}不通过以下propTypes定义：

{
    a: React.PropTypes.shape({
        x: PropTypes.string.isRequired
    }).isRequired
}

数组验证似乎无法正常工作。有什么想法吗？

Answer 1

您可以使用自定义验证器。当没有项目时，我不相信你可以在 arrayOf 中强制执行 string.isRequired .. 从 arrayOf 的自定义验证器的工作方式来看，它似乎在每个键上调用回调。因此，如果该值没有键，则不会调用任何验证器。

（注意，这没有经过测试）

a: function(props, propName, componentName) {
  var errorCount = 0
  var prop = props[propName]
  // ensure it is an array
  if (typeof prop !== 'array') {
    errorCount++
  }
  // ensure array has items
  else if (prop.length == 0) {
    errorCount++
  }
  // ensure all items are strings
  else {
    for (var i = 0; i < prop.length; i++) {
      if (typeof prop[i] !== 'string') errorCount++
    }
  }
  // throw error
  if (errorCount > 0) {
    return new Error(
      'Invalid prop `' + propName + '` supplied to' +
      ' `' + componentName + '`. Validation failed.'
    );
  }

对 arrayOf 所需元素的 React PropTypes 验证无法正常工作

React PropTypes validation for arrayOf required elements not working properly

reactjs

react-proptypes