Next.js如何在根路径接收region与lang参数?路由结构怎么设计?
Next.js 动态路由结构设计方案
你提到的 /pages/[region]/[lang]/index.js 这个路由结构完全有效,它会精准匹配 https://root.com/{region}/{lang} 路径,在该文件中你可以通过 useRouter() 钩子(客户端)或 getServerSideProps/getStaticProps(服务端/静态生成)获取 region 和 lang 参数。
要同时支持 https://root.com/{region}/{lang}/school 这个路径,需要补充以下路由结构:
- 方式一:在
/pages/[region]/[lang]/目录下创建school.js文件,直接匹配/school后缀的请求 - 方式二:在
/pages/[region]/[lang]/目录下创建school文件夹,并在其中添加index.js文件,效果和方式一一致,适合后续给/school扩展更多子路由的场景
至于你之前在根目录 index.js 中尝试动态路由失效的问题,这是正常现象——根目录的 index.js 仅负责匹配根路径 /,无法捕获 /{region}/{lang} 层级的参数,必须按照路径层级创建动态路由目录才能生效。
内容的提问来源于stack exchange,提问作者Adil Akhmetov
相关产品推荐
相关产品推荐

