在next.js中,index.js与page.js之间有什么区别?

3z6pesqy  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(148)
  1. https://nextjs.org/docs/pages/building-your-application/routing/pages-and-layouts
    我正在浏览这个next.js文档。
  • 这里说index.js充当目录的根。所以如果我在URL中输入/blog,它会把我带到pages/blog/index.js文件。

现在我的问题是我有pages/blog/subcomponent.js,我不希望用户访问/blog/subcomponent,因为它是一个子组件。我怎么能这么做呢?

  1. https://nextjs.org/docs/app/building-your-application/routing/pages-and-layouts
    现在我看到了next.js的另一个文档,我们可以使用page.js而不是index.js,并且只有page.js可以公开访问。
  • 那么这是否意味着如果不是page.js,则无法访问其他文件?

我真的很困惑。如果你能帮忙的话

0lvr5msh

0lvr5msh1#

Nextjs中有两种类型的路由:
1.页面路由器
1.应用路由器

Pages router(共享的第一个链接)

如果页面组件在pages目录的某个文件夹中,则强制使用index.tsx,如果不想使用文件夹,则可以直接在pages目录中创建一个带有页面名称的文件。例如:
pages/blog.js → /blog(wihtout文件夹)
pages/blog/index.js → /blog(在文件夹中)

应用路由器(共享的第二个链接)

如果页面组件在app目录的某个文件夹中,则强制使用pages.tsx,如果不想使用文件夹,则直接在app目录中创建一个以页面名称命名的文件即可。例如:
app/blog.js → /blog(wihtout文件夹)
app/blog/pages.js → /blog(在文件夹中)
至于文件夹中的其他文件,只要您的文件夹中有pages.tsx或index.tsx,它们就无法访问。但将组件放置在页面或应用程序文件夹中并不是一个好的做法。您应该只将页面主组件放在这些目录中。

相关问题