Was führt dazu, dass meine React-Seitenleiste beim Laden einer neuen Seite wackelt?

Question

Für den Kontext verwende ich die React-Bootstrap-Bibliothek. Immer wenn ich auf das href im Code klicke, wackelt die Seitenleiste eine halbe Sekunde lang, fast so, als würde sie in ihren nicht formatierten Zustand zurückgesetzt und dann in ihre normale Form zurückkehren. Weiß jemand, warum das passiert? Liegt es daran, dass mein Code zu langsam ist? Hier ist mein Sidebar-Code:

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

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