Я рендерирую такой компонент, подобный этому, в Approuter.js on element document.getElementById ("Side-bar"); , элемент находится в домашней странице WordPress
, когда я нажимаю и направляюсь, чтобы/сделиться , компонент, но сразу же исчезает в 1 секунды. Как мне изменить его, чтобы на боковой панели компонента оставаться/упорно, пока пользователь включен/сделок
Примечание: DealsList рендерирует правильно и сохраняется при маршрутизации/сделок
import React, { useEffect, useState } from "react";
import { Routes, Route, useLocation } from "react-router-dom";
import { createPortal } from "react-dom";
...
export const AppRouter = () => {
const location = useLocation();
const [categories, setCategories] = useState({});
const [sidebarContainer, setSidebarContainer] = useState(null);
useEffect(() => {
// Fetch categories once when the app loads
fetchCategories().then((data) => {
if (typeof data === "object" && data !== null) {
setCategories(data);
} else {
console.error("Invalid category format:", data);
setCategories({});
}
});
}, []);
useEffect(() => {
// Find the sidebar container from the WordPress PHP homepage
const container = document.getElementById("side-bar");
setSidebarContainer(container);
}, []); // Run once on mount
return (
..
{/* Inject Sidebar into WordPress' existing #side-bar */}
{location.pathname === "/deals" && sidebarContainer
? createPortal(, sidebarContainer)
: null}
);
};
Подробнее здесь: https://stackoverflow.com/questions/794 ... ific-route