如何使用 Next.js 在每一侧添加组件？

Question

我想在每一侧都有 Component Header，在 React 中，您可以通过在 <Switch> 之前从 react-router-dom 传递 Component 来简单地实现这一点，以及如何使用 Next.js?

我试图按照本教程进行操作，但没有结果：https://adamwathan.me/2019/10/17/persistent-layout-patterns-in-nextjs/

我也在尝试实现 Next.js 文档中的高级内容 https://nextjs.org/docs/advanced-features/custom-app

pages/index.js

const Home = ({ products }) => {
  useEffect(() => {
    console.log(products);
  }, []);
  return (
    <div className="container">
      <Head>
        <title>Create Next App</title>
        <link rel="icon" href="/favicon.ico" />
      </Head>

      <Advantages></Advantages>
      <Recommend products={products}></Recommend>
    </div>
  );
};

我想添加一个 Header 组件，它应该在我的应用程序的每一侧都可见。我可以用 Next.js 做这个吗？？

Answer 1

我问你想要整个页面的布局吗？如果是这样，with-app-layout这是一个官方例子，你可以参考。

如何使用 Next.js 在每一侧添加组件？

How to add Component on each side using Next.js?

javascript

reactjs

next.js