我正在学习使用NextJS,我正在使用应用路由器的最新版本,我目前停留在如何进行路由,例如在哪里放置注册和登录页面,以及它的文件夹结构一般,我把组件放在哪里以及如何将其他相关组件组合在一起,你能阐明这个主题吗,请尽可能简单,也许给予一些例子,因为我还在学习,任何帮助将不胜感激,谢谢!
yzckvree1#
有些人把components放在应用程序里面,但我把它们放在外面,告诉其他工程师app目录只包含页面组件。如果你有类似的路由,你可以在app目录中使用()语法。举个例子
components
app
()
在auth文件夹中,您可以使用共享布局的login和signup页面。在components文件夹中,您可以为providers、ui或shared组件创建子文件夹。
auth
login
signup
providers
ui
shared
xghobddn2#
您可以在最新的应用程序路由器版本中使用各种路由,甚至可以自定义路由以使用您自己的自定义路由。Next.js应用路由器的默认路由:创建页面时,可以直接在文件夹内创建一个带有页面名称的文件夹,例如about page,create about folder,create page.jsx(在about folder内,作为about的索引页即可以通过URL/about)App /about page.jsx访问2.)实施自定义工艺路线你可以在next-config中添加
async rewrites() { return [ { source: '/old-route', destination: '/new-route', }, // Add more custom routes as needed ];
我也研究过目录结构,当我开始For Best Practices时,我直接在App中创建页面directory.like all/products/page.jsx或app/about/page.jsx对于管理员UI,我使用app/admin/pagenameofadmin/page.jsx app/admin/page.tsx(管理员主页)对于所有其他组件,请使用组件文件夹,并在组件中创建子文件夹以轻松查找组件布局-用于常见和重复组件,如页眉/页脚/侧边栏auth -用于登录注册相关组件admin -用于管理UI组件pagename -用于页面特定组件也可以为特定的内容类型创建文件夹,如果你想保持一切组织在下一个层次,我建议使用它为复杂的项目只产品-为产品realted组件将api保存在app/utils文件夹中。
2条答案
按热度按时间yzckvree1#
有些人把
components
放在应用程序里面,但我把它们放在外面,告诉其他工程师app
目录只包含页面组件。如果你有类似的路由,你可以在app
目录中使用()
语法。举个例子在
auth
文件夹中,您可以使用共享布局的login
和signup
页面。在components文件夹中,您可以为
providers
、ui
或shared
组件创建子文件夹。xghobddn2#
您可以在最新的应用程序路由器版本中使用各种路由,甚至可以自定义路由以使用您自己的自定义路由。
Next.js应用路由器的默认路由:创建页面时,可以直接在文件夹内创建一个带有页面名称的文件夹,例如about page,create about folder,create page.jsx(在about folder内,作为about的索引页即可以通过URL/about)App /about page.jsx访问
2.)实施自定义工艺路线
你可以在next-config中添加
我也研究过目录结构,当我开始For Best Practices时,我直接在App中创建页面directory.like all/products/page.jsx或app/about/page.jsx
对于管理员UI,我使用app/admin/pagenameofadmin/page.jsx app/admin/page.tsx(管理员主页)
对于所有其他组件,请使用组件文件夹,并在组件中创建子文件夹以轻松查找组件
布局-用于常见和重复组件,如页眉/页脚/侧边栏auth -用于登录注册相关组件admin -用于管理UI组件pagename -用于页面特定组件
也可以为特定的内容类型创建文件夹,如果你想保持一切组织在下一个层次,我建议使用它为复杂的项目只产品-为产品realted组件
将api保存在app/utils文件夹中。