Почему не работает Link в react-router?

Question

[KirylLapouski]

Почему при нажатии по элементу Link, адресная строка браузера обновляется, а отрисовка компонентов, соответствующих этой ссылке не происходит?

Comments

[Антон Спирин]

Код свой скиньте и package.json.

[Vitaliy]

Возможно вы не обернули все ваши компоненты с Link'ами в Router

[Антон Спирин]

Виталий Столяров, не знаю, что там в старых версиях, но в react-router-dom 4, если использовать Link за пределами Router, то на этой строке приложение упадет с ошибкой TypeError Cannot read property 'history' of undefined. Полагаю, со старыми версиями аналогично.

[KirylLapouski]

Антон Спирин, Код: https://github.com/KirylLapouski/testManager/blob/...
Package.json: https://github.com/KirylLapouski/testManager/blob/...

Answer 1

[Антон Спирин]

Потому-что вы используете два роутера в приложении. Из одного хотите поменять контент в другом. Это так не работает.
Демо.
Попробуйте открыть старницу Test по нижней ссылке, у вас ничего не получится, так как Router не обрабатывает такой путь, при этом Link успешно подменяет location.
В верхнем роутере этот путь обрабатывается и контент успешно обновляется.

Вам надо объединить все в один роутер.
Демо 2

Comments

[KirylLapouski]

Большое спасибо.

[KirylLapouski]

Антон Спирин Вроде сделал как во второй демке, но всё равно не работает. Вот ссылка на routes https://github.com/KirylLapouski/testManager/tree/...
а вот где routes объединяются https://github.com/KirylLapouski/testManager/blob/...

[Антон Спирин]

KirylLapouski, нет у вас в NavBarCustom свой роутер. Уберите его.

Answer 2

[Сергей Глейп]

Причин может быть масса. Нужно больше информации.

Answer 3

[podpalmoi]

Код уже недоступен. У меня была такая проблема, помогло поместить React.StrictMode внутрь BrowserRouter: