每当加载新页面时，是什么导致我的 React 侧边栏抖动？

Question

对于上下文，我正在使用 React-Bootstrap 的库。每当我单击代码中的 href 时，侧边栏都会抖动半秒钟，几乎就像它重置为无样式状态，然后返回到正常形式。有谁知道为什么会这样？是因为我的代码太慢了吗？下面是我的侧边栏代码：

import React from "react";
import "../../App.css";
import { Nav, Navbar } from "react-bootstrap";
import ProfileSection from "./ProfileSection";
import ContactBar from "./ContactBar";
import HomeItem from "./SidebarItems/HomeItem";
import BlogItem from "./SidebarItems/BlogItem";
import WorkItem from "./SidebarItems/ProjectItem";
import PhilItem from "./SidebarItems/PhilItem";
import { Container } from "@mui/system";

function Sidebar() {
    return (
        <Navbar expand="lg">
            <Container>
                <Navbar.Toggle aria-controls="responsive-navbar-nav" />
                <Navbar.Collapse id="responsive-navbar-nav">
                    <Nav defaultActiveKey="/" className="flex-column">
                        <ProfileSection />
                        <HomeItem />
                        <BlogItem />
                        <WorkItem />
                        <PhilItem />
                        <ContactBar />
                    </Nav>
                </Navbar.Collapse>
            </Container>
        </Navbar>
    )
};

export default Sidebar;

Answer 1

您的代码在我的设备上运行良好..一定是一些互联网或设备问题。我还检查了您的代码，您的代码没有问题。一旦部署就不用担心它会正常工作。