我有一个使用 Bulma 的下一个应用程序和一个 ServiceProvider。我在应用程序的顶层导入 bulma 和该提供程序。这将位于我的layout.js 文件中，但是那里的更改不会持续存在。当您转到子页面时，bulmas css 停止工作，并且代码错误表明我的 useSession 未正确包装在提供程序中。
这是我的layout.js
import { Inter } from "next/font/google";
import "bulma/css/bulma.min.css";
import Provider from "@/components/Provider";
const inter = Inter({ subsets: ["latin"] });
export const metadata = {
title: "BD-Util",
description: "",
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body className={inter.className}>
<Provider>
{children}
</Provider>
</body>
</html >
);
}
这是我的page.js
import Navbar from "@/components/Navbar";
export default function Home() {
return (
<>
<section className="hero is-fullheight">
<Navbar />
<div className="hero-body is-flex-direction-column is-justify-content-center">
<h1 className="title">BD-Util</h1>
</div>
</section>
</>
);
}
我还将附上我的应用程序结构的屏幕截图。
您能否显示提供程序组件，因为它可能存在问题。
