37 lines
1.0 KiB
TypeScript
37 lines
1.0 KiB
TypeScript
// 不自动运行
|
|
// 服务端组件(默认):在服务器上取数和渲染,HTML 直接包含常见问题,对 SEO 友好;不会把这段代码发到浏览器。
|
|
import { Chat } from "./chat";
|
|
|
|
interface Faq {
|
|
id: number;
|
|
q: string;
|
|
a: string;
|
|
}
|
|
|
|
async function getFaqs(): Promise<Faq[]> {
|
|
// 真实项目:await fetch("https://cms.example.com/faqs", { next: { revalidate: 300 } })(缓存策略以官方文档为准)
|
|
return [
|
|
{ id: 1, q: "多久内可以退货?", a: "签收 7 天内可以无理由退货。" },
|
|
{ id: 2, q: "怎么开发票?", a: "在订单详情页申请电子发票。" },
|
|
];
|
|
}
|
|
|
|
export default async function Page() {
|
|
const faqs = await getFaqs();
|
|
return (
|
|
<main>
|
|
<h1>帮助中心</h1>
|
|
<section>
|
|
{faqs.map((f) => (
|
|
<details key={f.id}>
|
|
<summary>{f.q}</summary>
|
|
<p>{f.a}</p>
|
|
</details>
|
|
))}
|
|
</section>
|
|
{/* 交互部分是客户端组件,只有它的 JS 会发到浏览器 */}
|
|
<Chat />
|
|
</main>
|
|
);
|
|
}
|