Привет. Подскажите, пожалуйста касательно https://reactrouter.com/ Часть сайта это обычные html странички.

Question

Привет. Подскажите, пожалуйста касательно https://reactrouter.com/ Часть сайта это обычные html странички.

Часть — React SPA.
Внутри SPA есть навигация по всему сайту.
По клику происходит:

const SideNavigationWrapper = () => {
const navigate = useNavigate();
// …
<Link href="…" onFollow={(event) => {
navigate(event.detail.href);
}}/>

Проблема в том что навигация не работает вне SPA. Получаю белый экран.
Желаемое поведение — фолбек к нормальной навигации со сменой странички на не SPA-шную.

Это возможно?
Я бы ожидал этого по умолчанию, но нет.

И нет, не могу использовать стандартный компоненты ссылки роутера.
Должен использовать ссылку из диайн системы. И подключить роутер в onFollow

#frontend #javascript #programming #react.js #russian

0

09.06.2022

3 ответов

25 просмотров

Anton Nemtsev Автор вопроса

Мешает то, что тогда для ссылок внутри SPA тоже будет происходить полная перезагрузка страницы. Мне бы хотелось что бы внутри SPA навигация происходила react-way с частичным обновлением. Кроме того я открываю ссылку в том же окне по умолчанию, не в новом. так что это window.location.href= Есть способ понять знает ли реакт роутер урл?

0

09.06.2022

Anton Nemtsev Автор вопроса

Alex
Так ведь ты готовые страницы открываешь через useN...

а как отличить урлы страниц внутри spa от страниц вне spa? в меню же просто текчтовые урлы.

0

09.06.2022

Alex · Accepted Answer

Так ведь ты готовые страницы открываешь через useNavigate (для spa), остальные через window.open (обычные странички, вторым параметром указать "_self", чтоб на этой же вкладке). Ну и соответственно, при переходе с обычной страницы на spa и обратно будет перезагрузка страницы. А внутри spa будет без перезагрузок. По крайней мере в моем понимании так. Хотя может я что-то не так понял из того, что нужно...

169 похожих чатов

Привет. Подскажите, пожалуйста касательно https://reactrouter.com/ Часть сайта это обычные html странички.

3 ответов

Похожие вопросы