javascript - 错误 TS2698：传播类型只能从对象类型创建。如何修复此错误？

Question

我的反应应用程序中有一个 HOC 这是代码。

export function checkToken<Props>(WrappedComponent: new() => React.Component<Props, {}>) {
    return (
        class PrivateComponent extends React.Component<Props, LocalState> {
            constructor() {
                super();
                this.state = {
                    isAuthed: false
                }
            }

            async componentDidMount() {
                let token = localStorage.getItem('dash-token');
                let config = {
                    headers: { 'x-access-token': token }
                }
                let response = await axios.get(`${url}/users/auth/checkToken`, config)
                if (!response.data.success) {
                    localStorage.removeItem('dash-token');
                    browserHistory.push('/login');
                } else {
                    this.setState({isAuthed: true});
                }
            }

            render() {
                let renderThis;
                if (this.state.isAuthed) {
                    renderThis = <WrappedComponent {...this.props} />
                }
                return (
                    <div>
                        {renderThis}
                    </div>
                )
            }
        }
    )
}

运行此应用程序时，我收到以下错误。

错误 TS2698：传播类型只能从对象类型创建。

当我传递 props 时，我的传播语法似乎存在问题{...this.props}。

这就是我使用这个 HOC 的地方。

const app = document.getElementById('root') as HTMLElement;
ReactDOM.render(
  <Router history={browserHistory}>
    <Route path={'/'} component={App}>
      <IndexRoute component={checkToken(ListPage)} />
      <Route path={'/terms-page/:id'} component={checkToken(TermsPage)} />
      <Route path={'/default-settings'} component={checkToken(DefaultSettings)} />
      <Route path={'/login'} component={LoginPage} />
      <Route path={'/logout'} component={Logout} />
    </Route>
  </Router>
,app);

还要清楚这是一个编译时错误。

我哪里错了？