第 5 步：页面标题
本课属于 Coddy React 学习旅程的“Next.js 基础”单元。第 43 课，共 47 课。
挑战
简单为每道菜设置独立的标签页标题。
- 在
app/menu/[slug]/page.jsx中，导出async function generateMetadata({ params })。 - 等待
params获取 slug，然后执行await getDish(slug)。 - 如果没有这道菜，返回
{ title: 'Not on the menu' }。 - 否则，将这道菜的
name作为title返回，并将它的description作为description返回。
亲手试试
import Link from 'next/link';
import './globals.css';
export const metadata = {
title: {
default: 'Coddy Eats',
template: '%s | Coddy Eats',
},
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
<nav className="nav">
<Link className="brand" href="/">Coddy Eats</Link>
<Link id="nav-menu" href="/">Menu</Link>
<Link id="nav-desserts" href="/?category=dessert">Desserts</Link>
</nav>
<div className="container">
{children}
</div>
</body>
</html>
);
}Next.js 基础中的所有课
8项目：Coddy Eats
第 1 步：页面框架第 2 步：菜单网格
第 3 步：菜品页面第 4 步：加载状态第 5 步：页面标题第 6 步：加入购物车第 7 步：分类筛选第 8 步：留下评价第 9 步：实时搜索