创建新页面
创建流程
在 RavenSaaS 中创建新页面,跟 NextJS 框架创建新页面的规则一致。NextJS 页面与布局
1. 在 app/[locale]/(default) 目录下创建一个新的文件夹,新建一个 page.tsx 文件,并添加新页面的内容:
app/[locale]/(default)/new-page/page.tsx1export default function NewPage() { 2 return ( 3 <div className="min-h-screen bg-background"> 4 <div className="container mx-auto px-4 py-16 md:py-24"> 5 <div className="text-center max-w-3xl mx-auto"> 6 <h1 className="text-4xl sm:text-5xl font-bold tracking-tight text-foreground mb-4"> 7 NEW PAGE 8 </h1> 9 <p className="text-xl text-muted-foreground mb-8"> 10 This is an example of a new page, you can customize the content as needed. 11 </p> 12 </div> 13 </div> 14 </div> 15 ); 16}

2. 在浏览器访问新页面的地址,即可看到新页面渲染后的内容:

新页面会复用在 app/[locale]/(default)/layout.tsx 文件中定义的布局,默认显示 Header 和 Footer。
如果你希望新页面有不一样的布局,需要创建新的 Layout 文件。具体步骤参考 NextJS Layout 文档 NextJS 页面与布局
参考
Last updated on 2025年1月5日