reactjs - 类型 '{ children: Element; }' 不可分配给类型 'IntrinsicAttributes & ReactNode'

Question

这里出现这个错误:

Type '{ children: Element; }' is not assignable to type '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 ) => {}