Проблема с хешлинками. Когда я хочу перейти к определенным разделам другой страницы, вместо этого они перенаправляют мен ⇐ Javascript

[Anonymous]

Я новичок в области фронтенд-разработки. Я хотел начать с личного проекта и попутно учиться.
Я разрабатываю базовый сайт для магазина. Вот как выглядит домашняя страница: Домашняя страница (под разделом «В ПРОДАЖЕ» есть раздел «Местоположение» и нижний колонтитул, где будет находиться контактная информация. Существует также еще одна страница, на которой я буду показывать продукты: страница «Продукты».
Когда я нахожусь на домашней странице, я могу легко перемещаться по разделам на странице, используя панель навигации выше. Проблема возникает, когда я нахожусь на странице продуктов, и я хочу перейти оттуда к определенному разделу. на домашней странице (скажем, в разделе "Местоположение"). В адресной строке отображается правильная ссылка (http://localhost:1234/#location), но она не ведет меня в этот раздел, а переходит в начало домашней страницы.
Теперь вот те части кода, которые, по моему мнению, имеют отношение к делу:

Код: Выделить всё

function NavBar() {
return(


[list]
[*][url=/#onsale]ON SALE[/url]
[*][url=products]Products[/url]
[*][url=/#location]Location[/url]
[*][url=#contactus]Contact Us[/url]
[/list]


);
}

Я использую элемент вместо компонента Link, который входит в состав библиотеки React-Router, потому что, когда я его использовал, я даже не мог перемещаться по одной и той же странице.
Что я уже пробовал:

• Использование HashLink из пакета React-Router-Hash-Link. Не помогло, выдавало ошибки. Я думаю, что он несовместим с последней версией React-Router.
• Я также пытался установить этот пакет @cascadia-code/scroll-to-hash-element, который утверждает, что устраняет проблему, но при попытке его установки возникли ошибки.

Что мне нужно:
Пакет, который позволяет мне переходить к разделам других страниц и не переводить меня наверх, когда я хочу перейти к определенному разделу.

Подробнее здесь: https://stackoverflow.com/questions/798 ... ther-pages