将应用程序栏停靠在反应材质ui的窗口顶部 [英] Dock App Bar to top of window in react material ui

问题描述

在React material ui中，如何使应用栏固定，以便在页面其余部分滚动时保持固定?

In React material ui, how do you make app bar fixed so that it stays fixed while the rest of the page scrolls?

推荐答案

不知道此功能是否是新功能，但您不需要上面的代码.只需将position="fixed"属性添加到<AppBar />

Don't know if this feature is just new but you don't need the code above. Just add a position="fixed" attribute to your <AppBar />

return (
  <div className={classes.root}>
    <AppBar position="fixed">
      <Toolbar>
        <IconButton className={classes.menuButton} color="inherit" aria-label="Menu">
          <MenuIcon />
        </IconButton>
        <Typography variant="title" color="inherit" className={classes.flex}>
          Title
        </Typography>
        <Button color="inherit">Login</Button>
      </Toolbar>
    </AppBar>
  </div>
);

调整后的示例来自: https://codesandbox.io/s/yw67vxwo69 (demo.js )

Adjusted example from: https://codesandbox.io/s/yw67vxwo69 (demo.js)

这篇关于将应用程序栏停靠在反应材质ui的窗口顶部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！