Блог

Я создал один спа-салон с помощью jQuery. SPA выполняется путем написания пользовательского маршрутизатора, в котором мы добавляем видимое имя класса в div страницы, чтобы сделать эту страницу видимой, и удаляем то же имя класса со всех других страниц, используя jquery, подобный этому,

 $(".main-content .page").removeClass("visible");
const page = $(`#${pageId}`);
page.addClass("visible");
 

Теперь я переношу этот сайт, чтобы использовать компоненты react здесь и там через веб-сайт. У меня есть один компонент на одной из страниц, который отображает данные о продукте на основе идентификатора в URL-адресе, но проблема в том, что он не повторяется, даже если я изменяю URL-адрес. Он не может обнаружить изменение, так как состояние или реквизиты не меняются.

есть ли способ заставить повторно использовать этот компонент из моего другого кода JS?

Решение было довольно простым, но оно нигде не упоминается.

В официальном руководстве говорится, что нужно использовать этот приведенный ниже код в конце файла, чтобы, когда наш файл js будет загружен браузером и запущен, он отобразил наш код реакции, но дело в том, что мы можем вызвать этот метод из любого места, чтобы принудительно перезапустить наш компонент/ заменить наш компонент новым экземпляром.

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

 ReactDOM.render(<ProductDetails />, document.getElementById("product-details"));
 

Используя это, мы даже можем передать новые реквизиты, если захотим.