我无法滚动我的Nextjs网页应用程序

8wtpewkr  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(108)

我有以下问题,我有我的投资组合网页的基础上3个组件,英雄,关于和投资组合。布局是下一个:

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <Navbar />
      <main>{children}</main>
    </html>
  )
}```

字符串
下一页.tsx:

return (
   <main>
  <HeroSection />
   <AboutMe />
   <Portfolio />
   </main>
   
  )
}```

ego6inou

ego6inou1#

首先,你的RootLayout似乎是错误的。应该有body元素通过children
有关布局的更多信息,请参阅Nextjs文档。
RootLayout应该看起来像这样:

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body>
        <Navbar />
        <main>{children}</main>
      </body>
    </html>
  );
}

字符串
不确定内容的高度,但您可以尝试以下操作:

.content{
  height: 100vh;
  overflow: auto;
}


page.tsx中,将内容 Package 到div元素中

<div className="content">
  <HeroSection />
  <AboutMe />
  <Portfolio />
</div>


希望能帮上忙!

相关问题