我在Next.js 13.4中使用新的app/目录。有没有一种方法可以根据我所在的路由在根目录layout.tsx中进行条件布局？用例是主页，所有子页面共享在根layout.tsx中定义的相同布局，除了一些子页面应该具有不同的主体背景颜色。理想情况下，我应该在根布局中定义的body标记上设置背景色。这可能吗？是否有一个 prop ，我可以阅读的布局，看看哪条路线正在渲染？我还有其他类似的用例，所以如果有一个基于路由的有条件渲染布局的解决方案就好了。
app/
layout.tsx
body
xcitsw881#
这是可能的，您可以将文件夹标记为路由组，以防止该文件夹包含在路由的URL路径中或嵌套在父布局中。更多可以在official documentation中找到。
app/ ├─ page.tsx ├─ layout.tsx <- layout for the home page ├─ (shop)/ <- route group, defined by encasing name in () │ ├─ layout.tsx <- layout for all pages in this group │ ├─ products/ │ │ ├─ page.tsx
1条答案
按热度按时间xcitsw881#
这是可能的，您可以将文件夹标记为路由组，以防止该文件夹包含在路由的URL路径中或嵌套在父布局中。更多可以在official documentation中找到。