Question

我最近将所有的React库更新为最新以及所有类型。我遇到打字稿编译问题。就是说

[ts] Type '{ history: History<any>; location: Location<any>; match: match<any>; staticContext?: StaticContext; }' is not assignable to type 'LibraryManagedAttributes<T["component"], Readonly<{ children?: ReactNode; }> & Readonly<{ history: History<any>; location: Location<any>; match: match<any>; staticContext?: StaticContext; }>>'. [2322]

type PrivateRouteProps = UserAuthStore.UserAuthState &
    typeof UserAuthStore.actionCreators &
    RouteProps &
    { component: typeof React.Component };

class PrivateRoute<T extends PrivateRouteProps = PrivateRouteProps> extends React.Component<T, {}> {


    render() {

        let auth = new Auth();

        const {
            isAuthenticated,
            component: Component,
            ...props
        } = this.props

        if (!isAuthenticated) {
            console.log(this.props)
            window.location.href = auth.getAuthorizeUrl(this.props.location!.pathname!)
        }        

        return (
            <Route
                {...props}
                render={props => isAuthenticated ? <Component {...props} />: (<div>Redirecting...</div>)}
            />
        )
    }
}

“ {Component}”上的<Component {...props} />出现错误。

Answer 1

我从这样的破坏和强制类型中删除了

const Compoonent = this.props.component as React.ComponentType<{} & RouteComponentProps<{}>>;

这对我有用。我从这里读到的。 https://github.com/DefinitelyTyped/DefinitelyTyped/issues/17355#issuecomment-310544041

Answer 2

您应该更改PrivateRouteProps

{ component: typeof React.Component };

应该是

{ component: React.Component };

如何修复无法分配给React Router Render Pro的LibraryManagedAttributes的类型

2 个答案: