与“PropTypes.element”相对应的“defaultProp”的正确值是什么？

我有一个组件，我希望接受另一个组件作为道具，并渲染它。我希望传递的组件是可选的，并且在这种情况下不渲染任何内容。

下面的代码可以完美运行：

const Component = ({ Inner }) => (
  <div style={{ borderStyle: "solid" }}>
    <Inner />
  </div>
);

Component.propTypes = {
  Inner: PropTypes.element
};

Component.defaultProps = {
  Inner: () => null
};

但是，在第一次加载页面时，prop-types抱怨：

警告：失败的道具类型：无效的道具Inner类型的function供应给Component，预期有一个 ReactElement。

我目前的解决方案是重新定义propType as PropTypes.oneOfType([PropTypes.element, PropTypes.func])，但这似乎完全不正确。

我应该做什么propType or defaultProp实际上是？

沙箱中的 SSCCE.

这个问题类似于如果元素的 proptype 是默认值？，但这已经接受了一个不起作用的答案，即使它起作用了，对我来说也没有多大帮助，因为我正在真正使用 React Native。正如我所说，我没有以与本机反应有关的方式提出这个问题，我的例子works， 只是prop-types是个大坏蛋。

使用 elementType 的类型将解决您的问题。

Component.propTypes = {
  Inner: PropTypes.elementType
};

由于您的 prop 是一个 React 组件，因此我们使用 elementType。如果您打开 prop-types 的源代码，您会在那里找到它。

希望这对您有帮助。