类型'{子:元素；}‘不能分配到键入'IntrinsicAttributes & ReactNode’

Question

这里有这个错误：

类型'{子元素；}‘不能分配给键入'IntrinsicAttributes & ReactNode’。

export const withAppProvider = (Component: AppComponent) => {
  return function WrapperComponent(props: any) {
    return (
      <AppProvider> // <-- here
        <Component {...props} />
      </AppProvider>
    );
  };
};

也许AppProvider声明有什么问题吗？

export const AppProvider = (children: ReactNode) => {
  const { width, height } = useWindowSize();
  const isClient = useClient();
  const isMobile = isClient ? width < 1200 : false;

  return (
    <AppContext.Provider
      value={{
        isClient,
        isMobile,
      }}
    >
      {children}
    </AppContext.Provider>
  );
};

这是用export const AppProvider = (children: React.ReactNode) => {做的

Type error: Type '{ children: Element; }' is not assignable to type 'IntrinsicAttributes & ReactNode'.
  Type '{ children: Element; }' is missing the following properties from type 'ReactPortal': key, type, props

Answer 1

如果它被定义为children支柱，那么问题就消失了。

interface IProps {
  children: React.ReactNode;
}
export const AppProvider = ({children}: IProps ) => {}