IT技术 - 如何在 react-typescript 中设置 HOC 中的props类型？ - 吾爱随笔录

我有一个简单的 withAuth HOC。我正在尝试定义props的类型。

const withAuth = (Component: typeof React.Component) => (role: string) => {
  return (props) => {
    const { data, loading } = useGetUser();
    if (loading) {
      return <p>Loading...</p>;
    }

    if (!data) {
      return <Redirect ssr to="/api/v1/login" />;
    } else {
      if (role && !isAuthorized(data, role)) {
        return <Redirect ssr to="/api/v1/login" />;
      }

      return <Component user={data} loading={loading} {...props} />;
    }
  };
};

我试过这个：

React.Component<T>

然后传递T给props:T我收到2个警告。

  Component: typeof React.Component<T> // Parameter '(Missing)' implicitly has an 'any' type.

 props:T // Cannot find name 'T'

import React, { FC } from 'react' type Props = { name: string } const A: FC<Props> = () => <div></div> const withAuth = <P extends object>(Component: React.ComponentType<P>) => (role: string) => { return (props: P) => { return <Component {...props} />; } }; const result1 = withAuth(A)('hello')({ label: 'hello' }) // error const result2 = withAuth(A)('hello')({ name: 'hello' }) // ok