英文:
2 Level of dynamic routing in next.js
问题
我是新手，想问一下如何在next.js中实现两级动态路由？
我的URL是http://localhost:3000/company/[slug1]/[slug2]。
在next.js的官方文档中，我只找到了一级嵌套路由。
我想要两级路由。
请帮助我。
英文:
I am new to next.js. I want to ask how to achieve two level of dynamic routing in next.js?
My url is http://localhost:3000/company/[slug1]/[slug2]
In the next.js's official documentation I got only one level nesting routing.
I want to 2 level routing.
Plese help me.
答案1
得分: 1
创建类似以下的目录结构
pages/
└─ company/
└─ [slug1]/
└─ [slug2].js
要在客户端访问片段
import { useRouter } from 'next/router';
export function Component() {
const router = useRouter();
const { slug1, slug2 } = router.query;
// ...
}
或者如果在服务器端
export async function getServerSideProps(ctx) {
const { slug1, slug2 } = ctx.params;
// ...
}
英文:
Create directory structure like this
pages/
└─ company/
└─ [slug1]/
└─ [slug2].js
To access segments on the client side
import { useRouter } from 'next/router';
export function Component() {
const router = useRouter();
const { slug1, slug2 } = router.query;
// ...
}
Or if on the server side
export async function getServerSideProps(ctx) {
const { slug1, slug2 } = ctx.params;
// ...
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论