React.PropTypes.number以最小值和最大值浮点数

Question

completed: React.PropTypes.number,

我可以props在React组件中指定数字的最小值和最大值.

期待如下:

completed: React.PropTypes.numberBetween(min, max),

我生成一个数组来指定范围

尝试:

completed: React.PropTypes.oneOf(Array.from({length: max -min+1, (v, k) => k + min})),

但是,我希望 completed道具也接受浮动,而现在它只接受整数.

如何将以下约束组合在一起:

• prop 是数字(整数,浮点数,双数,......任意数字)

• 在MIN和MAX之间

Answer 1

您可以使用自定义验证.

completed: function(props, propName, componentName) {
   if(props[propName] < MIN || props[propName] > MAX) {
      return new Error('Invalid');
   }
}

Answer 2

通过写一个Custom Props Validator,你可以实现这一点.试试这个:

num: function(props, propName, componentName) {
    if(typeof props[propName] != 'number'){
      return new Error ('Invalid type of `' + propName + '` supplied to' + ' `' + componentName + '`. Validation failed.');
    }else if (props[propName] < MIN || props[propName] > MAX) {
      return new Error('Invalid prop `' + propName + '` supplied to' + ' `' + componentName + '`. Validation failed.');
    }
},