javascript – 创建自定义PropTypes,扩展react中的默认PropTypes

前端之家收集整理的这篇文章主要介绍了javascript – 创建自定义PropTypes,扩展react中的默认PropTypes前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在尝试创建一个自定义PropType,用于检查数组是否具有数值并且长度为2(并且对数字的排序有一些约束).

显然我可以为前两个约束做Array.PropType.arrayOf(Array.PropType.number).

我想在我的自定义PropType中重用它(而不是推出我自己的数字和数组检查).

我怎么做?

最佳答案
React.PropTypes.arrayOf(React.PropTypes.number)只返回一个函数,因此您可以提供自己的函数来执行验证.

您的函数将传递三个参数:props,propName,componentName

从文档中查看React.PropTypes显示的倒数第二个示例.

所以应该满足你的约束的函数是:

function isTwoElementArrayOfNumbers( props,componentName ){
  var _array = props[ propName ];

  if( _array && _array.constructor === Array && _array.length === 2 ){

    if( !_array.every(
      function isNumber( element ){
        return typeof element === 'number';
      })
    ){

      return new Error('elements must be numbers!');
    }
  }
  else{
    return new Error('2 element array of numbers not provided!');
  }
}

...in your react element
propTypes:{
  numArray: isTwoElementArrayOfNumbers
},

猜你在找的JavaScript相关文章