реагирующий маршрутизатор Не удается прочитать свойство «push» из неопределенного?

Question

некоторый код index.tsx:

ReactDOM.render(
<MemoryRouter>
    <LocaleProvider locale={zhCn}>
        <App/>
    </LocaleProvider>
</MemoryRouter>,
document.getElementById('root') as HTMLElement
);

некоторый код App.tsx

interface AppProps{
  history?: any
}
....
public route() {
    if (!session.isLogin) {
        this.props.history.push('/');
    } else {
        this.props.history.push('/root')
    }
}
...
public render() {
    return (
        <Switch>
            <Route exact path='/' component={Login} />
            <Route exact path='/root' component={Root} />
        </Switch>
    )
}

Когда я напишу это, я сообщу неправильно. Не могу прочитать свойство 'push'из неопределенного ， Затем я изменил использование «withRouter» для его изменения.

export default withRouter(App)

Также сообщается неправильно: ошибка TS2345: Аргумент типа 'typeof App' не может быть назначен параметру типа 'ComponentType>'.

Тип «typeof App» нельзя назначить типу «StatelessComponent>».

Тип «typeof App» не соответствует подписи »(props: RouteComponentProps & {children ?: ReactNode;}, контекст ?: любой): ReactElement |null '.

В чем проблема?

Спасибо

Answer 1

Ваше props в App.tsx необходимо расширить RouteComponentProps с react-router

, например:

interface AppProps extends RouteComponentProps {
    // rest of props
}

После этого вы сможете использовать:

this.props.history.push("/your-route");