NextJs 13：基于路由层次结构自定义 Next.js 布局

Question

我正在做一个 Next.js 13 项目，我有一条名为 problems/[slug] 的路线。在这条路线(e.g., problems/react) 的第一层，我有一个侧边栏和一个内容部分，我使用layout.tsx 显示它们。但是，在路由(e.g., /problems/react/test-problem) 的下一个嵌套级别上，我想使用不同的布局而不是原始布局。你能建议一种实现这一目标的方法吗？

Answer 1

参考我对该帖子的评论，您尝试做的事情应该没有问题。

您可以创建一个名为<ParentLayout /> 的组件并将其用作problems/react 的布局，并为problems/react/test-problem 使用不同的组件<ChildLayout />。

将适当的组件导入到相应的文件中，然后使用它们。