英文:
Next js parallel routing ruins all routing when i accept slot as my prop in rootlayout
问题
我有一个名为@auth的插槽位于一个名为app的文件夹内。在@auth文件夹内有一个名为login的文件夹，其中的page.jsx文件夹包含以下代码。
import LoginPopup from "@/components/Popups/LoginPopup/LoginPopup";
const Login = () => {
return <LoginPopup />;
};
export default Login;
我在我的app/layout.jsx中有这个根布局。
import Header from "@/components/Header/Header";
import Footer from "@/components/Footer/Footer";
import "./globals.css";
export const metadata = {
title: "SanSearch",
description: "Сайт по поиску юридических документов",
};
export default function RootLayout({ children, auth }) {
return (
<html lang="ru">
<body className="font-text" suppressHydrationWarning={true}>
<Header />
{children}
{auth}
<Footer />
</body>
</html>
);
}
当我尝试将auth插槽接受为一个prop并在我的布局中与children一起渲染时，我的路由会在每个我尝试获取的路由上出现404页面，但是当我将auth作为我的prop移除时，一切恢复正常。
我希望实现可以在next js中创建一个具有并行路由的上下文模态框。我不想创建一个拦截路由，因为我没有一个作为弹出窗口的页面。只有可以通过在/login页面上进行路由来实现的弹出窗口，而我的弹出窗口后面的页面仍然可以保存。
英文:
I have a slot named @auth inside of an app folder. inside of an @auth folder i have a login folder with page.jsx folder contains this code
import LoginPopup from "@/components/Popups/LoginPopup/LoginPopup";
const Login = () => {
return <LoginPopup />;
};
export default Login;
i have this root layout in my app/layout.jsx
import Header from "@/components/Header/Header";
import Footer from "@/components/Footer/Footer";
import "./globals.css";
export const metadata = {
title: "SanSearch",
description: "Сайт по поиску юридических документов",
};
export default function RootLayout({ children, auth }) {
return (
<html lang="ru">
<body className="font-text" suppressHydrationWarning={true}>
<Header />
{children}
{auth}
<Footer />
</body>
</html>
);
}
When i try to accept auth slot as a prop and render it with children in my layout my routing gets somehow ruined and get 404 page on every route i try to get. but when i remove auth as my prop everything goes back to normal.
i want to achieve that i can make a contextual modal with parallel routing in next js. i dont want to make an interception route because i dont have a page as popup. only popup that can be achieved by routing on /login page and page behing my popup can still be saved.
答案1
得分: 0
以下是翻译好的部分：
"在Next.js文档中没有提到，但我需要在我的所有路由中添加一个page.jsx和default.jsx。我在@auth和@auth/login中添加了默认的jsx，它起作用了。"
"https://github.com/vercel/next.js/issues/48749"
英文:
It's not said in next js docs, but i was in need to add a page.jsx and default jsx to all my routes in slot. i added default and page jsx that returned null in @auth and @auth/login and its worked
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论