React-在创建时检查proptype,而不是在渲染时

我有一个react组件,它可以接受子组件并决定是否呈现它们。如果它呈现它们,它也会将onClick处理程序传递给子级。

render() {
    const { children } = this.props;
    return (
      <div className="select">
        { this.state.showDropdown
          ? (
            <div className="select__dropdown">
              {React.Children.map(children, (child, index) => React.cloneElement(child, {
                onClick: () => this.onOptionSelected(index),
              }))}
            </div>
          )
          : null }
      </div>
    );
  }
}

看起来,这些子组件总是需要 onClick 要从父级传递的处理程序,因此我已将其标记为 isRequired 在儿童道具中。

Option.propTypes = {
  children: PropTypes.node.isRequired,
  onClick: PropTypes.func.isRequired,
};

问题是, onClick公司 总是由父组件添加,因此当我们像这样编写父组件时:

<Select>
      <Option>One</Option>
      <Option>Two</Option>
      <Option>Three</Option>
</Select>

我们不应该对孩子们指手画脚。但React对此发出警告:

 Warning: Failed prop type: The prop `onClick` is marked as required in `Option`, but its value is `undefined`.
     in Option

这是可以理解的,因为它似乎 Option 甚至在将元素传递给 Select 用于渲染的元素。

有没有办法让它好用,我应该 onClick公司 不需要,或者我应该在创建 选择权 元素,尽管我知道它稍后会被父元素重写。