获取Box组件的prop类型警告。https://codesandbox.io/p/sandbox/fragrant-forest-gn5rr6?file=%2Fsrc%2Fapp%2Fpage.tsx%3A1%2C1

Warning: Failed prop type: Invalid prop `children` supplied to `ForwardRef(Box)`, expected a ReactNode.

这是导致错误的PropType:https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Box/Box.js#L26
我猜我们可以把它改成oneOfType,但我不确定应该是什么🤔
我相信这在"纯"的React中不起作用，只在Next.js中起作用：

async function FooBar() {
  return <Box>foobar</Box>
}

export default function Page() {
  return (
    <Box>
      <FooBar />
    </Box>
  )
}

我想知道prop-types包是否支持将RSC作为子元素的模式。

可以确认这种情况确实发生过，不仅在 Box 组件中出现，其他组件也出现了。然而，除了控制台本身的错误之外，似乎没有任何问题，一切都按预期进行。
如果你将服务器组件 Package 在一个普通的 div 中，例如：

<Box>
    <div>
        <MyServerComponent />
    </div>
</Box>

那么错误就会消失。虽然这并不理想，因为会产生一个无用的额外div,但到目前为止效果还不错。

我找到了另一个基于@FernandVEYRIER的解决方案，不需要额外的div元素。

1. 创建一个 Package 器组件

'use client';

import React from 'react';

export const ClientToServer: React.FC<{
  children: React.ReactNode;
}> = ({ children }) => {
  return <>{children}</>;
};

1. 只需用 Package 器 Package 你的服务器组件

<Box>
    <ClientToServer>
        <MyServerComponent />
    </ClientToServer>
</Box>

这是导致错误的PropType:https://github.com/mui/material-ui/blob/master/packages/mui-material/src/Box/Box.js#L26
我想我们可以将其更改为oneOfType,但我不确定应该是什么🤔
我相信这在普通的React中不起作用，只在Next.js中起作用：

async function FooBar() {
  return <Box>foobar</Box>
}

export default function Page() {
  return (
    <Box>
      <FooBar />
    </Box>
  )
}

那么我们是否可以将其更改为any?

请查看 facebook/prop-types#407

我们可以：

• 将bug报告给Next.js。这似乎是根本问题。他们没有正确更新react-is
• 跳过子属性的proptypes生成，直到Next.js修复它。