如何使用 React 在滚动时创建固定/粘性标题

Question

我试图在 React 的滚动上创建一个固定/粘性标题。

但我无法创造这些东西。我正在为设计我想做的事情提供参考。

(https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_sticky_header( 我想在反应中实现以下内容

window.onscroll = function() {myFunction()};
var header = document.getElementById("myHeader");
var sticky = header.offsetTop;
function myFunction() {
if (window.pageYOffset > sticky) {
header.classList.add("sticky");
} else {
header.classList.remove("sticky");
}
}
```</script>

Answer 1

考虑使用位置 css 属性。position: sticky; top:0px;. 注意浏览器的可比性。