小编Gre*_*ich的帖子

如何在 React 中使用 tailwindcss 的平滑滚动?

tailwindcss我使用和创建了一个单页网站React。在原型中,我使用tailwindcss“scroll-smooth”类并且它有效。在React类中“滚动平滑”不起作用,但原因是什么?

https://tailwindcss.com/docs/scroll-behavior#basic-usage

当我单击导航上的“为什么”时,我跳转到“为什么”部分,但并不顺利:

function App() {
  return (
    <div className="App">
      <div className="relative">
        <div className="flex flex-col scroll-smooth">

          <HomeNav />

          <HomeHero />

          <section id="why" className="flex flex-col items-center px-6 pt-20">
            ...
          </section>
          <HomeFooter />
        </div>
      </div>
    </div>
  );
}
Run Code Online (Sandbox Code Playgroud)

解决方案:

我认为TailwindCss“滚动平滑”类不适用于反应。所以我使用NPM“react-scroll”包,它工作得很好,而且我可能不太担心兼容性。

https://www.npmjs.com/package/react-scroll

scroll smooth-scrolling reactjs tailwind-css

6
推荐指数
2
解决办法
9395
查看次数

Kubernetes 和 Docker 支持

Kubernetes 正在停止对 Docker 的支持。这对我的 Kubernetes 集群中的 Docker 容器究竟意味着什么?

https://github.com/kubernetes/kubernetes/blob/master/CHANGELOG/CHANGELOG-1.20.md#deprecation

docker kubernetes

0
推荐指数
1
解决办法
41
查看次数