реагировать на то, что маршрутизатор не отображает компоненты при изменении маршрута

Question

При начальной загрузке приложения он будет отображать правильный компонент, соответствующий URL-адресу. Однако, когда я изменяю щелчок по ссылке, он ничего не отображает.

index.tsx:

import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import { store } from './store/store';
import { App } from './components/app/App';
import { BrowserRouter } from 'react-router-dom';



render(

    <Provider store={store}>
        <BrowserRouter>
            <App />
        </BrowserRouter>
    </Provider>,
    document.getElementById('app')
);

Мой файл app.tsx, в который я поместил свои маршрутизаторы: это то, что я хочу, чтобы компоненты маршрутов выглядели так. ? Я не получаю никаких консольных ошибок или чего-либо, говорящего мне о проблеме. Поэтому не уверен, правильно ли упакованы компоненты или что может быть причиной проблемы.

Answer 1

Вы используете 2 маршрутизатора одновременно. Один внутри файла index, другой внутри файла app. Вы можете удалить один из них.

Например, оставьте только один внутри index:

<Router history={history}>
    <App />
</Router>

Answer 2

Измените это:

<Route path="/login" component={Login} />

на это:

<Route exact path="/login" component={Login} />