特定子组件的类型

Question

我有这样一个功能组件：

const Foo = () =

现在我有了另一个组件，它接受子组件，但应该特别限制为一个或多个Foo组件（不允许其他组件）。

常量栏=（{孩子}）=

如何在Bar上设置propTypes，以实现此验证？

Bar.propTypes = {
  children: PropTypes.oneOf([
    PropTypes.arrayOf(PropTypes.node),
    PropTypes.node,
  ]);
};

上面的代码太松散了，因为它会让任何组件类型都成为子组件。如何将其限制为只允许Foo？




Answer 1

您可以使用PropTypes。形状

Bar.propTypes = {
  children: PropTypes.oneOfType([
    PropTypes.shape({
      type: PropTypes.oneOf([Foo]),
    }),
    PropTypes.arrayOf(
      PropTypes.shape({
        type: PropTypes.oneOf([Foo]),
      })
    ),
  ]).isRequired
};