我想静态生成各种菜单页面的基础上的'类别'和'子类别'查询参数的URL,如:'/menu?category=savory'.由于我只有几个预期的类别和子类别,我认为静态生成可以很好地与菜单页一起工作,但我还没有找到任何解决方案。唯一的方法是将类别和子类别值作为动态管段而不是查询参数吗?
smtd7mpg1#
您可以在任何组件中使用next/router和conditional rendering。对于?category=savory:
?category=savory
import { useRouter } from 'next/router'; export default function MenuComponent() { const router = useRouter(); return( <div> {router.query.category == "savory" ? ( <p>savory</p> ) : ( <p>other</p> )} </div> ); }
**注意:**在预渲染时会为空,所以需要使用适当的默认值来捕捉。
1条答案
按热度按时间smtd7mpg1#
您可以在任何组件中使用next/router和conditional rendering。
对于
?category=savory
:**注意:**在预渲染时会为空,所以需要使用适当的默认值来捕捉。