Question

我正在使用React的PropTypes和Flow类型检查器，但是我无法获得可选的函数prop以通过类型检查。这是一个例子：

var Example = React.createClass({
  propTypes: {
    exampleFn: React.PropTypes.func
  },

  handleClick: function() {
    if (this.props.exampleFn) {
      this.props.exampleFn();
    }
  },

  render: function() {
    return <a onClick={this.handleClick}>Click here</a>;
  }
});

虽然我检查this.props.exampleFn不为空，但针对此代码运行Flow的类型检查器会出现错误

call of method exampleFn
Function cannot be called on possibly null or undefined value

我尝试了不同的变体，例如
if (this.props.exampleFn !== null && this.props.exampleFn !== undefined) {...}
或
this.props.exampleFn && this.props.exampleFn()
等我知道我们正在防范可能为空/未定义的值，但我无法找到有效的东西。当然，将道具类型更改为React.PropTypes.func.isRequired会导致没有错误，但我希望保持此道具可选。

如何获得可选的函数prop以通过类型检查？

Answer 1

以下是我们发现保持PropType可选但仍具有Flow类型检查通道的一种方法。

...

handleClick: function() {
  var exampleFn = this.props.exampleFn || null;
  if (exampleFn) {
    exampleFn();
  }
},

...

React组件中的可选函数prop流程类型检查失败

1 个答案: