回顾：导航
本课属于 Coddy React 学习旅程的“Next.js 基础”单元。第 38 课，共 47 课。
挑战
中等本章回顾：一个小应用，涵盖 URL 的两个方向：导航栏会读取当前所在位置，菜单页则根据查询字符串筛选内容。
- 在
components/Nav.jsx中，调用usePathname()，当链接的href与当前路径匹配时，为每个链接设置 className"nav-link active"；否则设置为普通的"nav-link"。主页是/，菜单是/menu。 - 在
app/menu/page.jsx中，从searchParams读取category（记住，它是一个promise），并且只显示匹配的菜品；如果没有提供类别，就显示所有菜品。
/menu?category=pizza 应显示 4 道菜中的 2 道，并高亮显示菜单链接。
亲手试试
import './globals.css';
import Nav from '../components/Nav.jsx';
export const metadata = {
title: 'Coddy Eats',
};
export default function RootLayout({ children }) {
return (
<html lang="en">
<body>
<Nav />
{children}
</body>
</html>
);
}