Q: Material-Ui Appbar如何解决浏览器地址栏后面滚动问题
Q: Material-Ui Appbar how to fix scrolling behind browser address bar
我正在使用 Material-Ui Appbar 但是当我向下滚动页面时，appbar 在 iOS 10 上位于地址栏下方。地址栏也保持打开状态比崩溃。我正在使用默认 material UI 主题。
我不认为它应该以这种方式工作。有没有正确执行此操作的示例？
如果 AppBar 固定在页面顶部就好了。
谢谢。
它实际上按设计工作。如果你想让它固定在页面顶部，你需要将CSS位置设置为"fixed"。这会根据需要将 AppBar 粘在顶部，但由于它漂浮在那里，它可能会掩盖其下方与其自身高度相当的内容。所以，你应该用一些填充或边距（默认为 56px）来补偿它。在外部容器上使用填充的示例：
<div style={{ paddingTop: 56 }}>
<AppBar style={{ position: 'fixed', top: 0 }} />
<p>
Lots of tall/long content here...
</p>
</div>
工作 jsFiddle：https://jsfiddle.net/qe141fd2/1/
我正在使用 Material-Ui Appbar 但是当我向下滚动页面时，appbar 在 iOS 10 上位于地址栏下方。地址栏也保持打开状态比崩溃。我正在使用默认 material UI 主题。
我不认为它应该以这种方式工作。有没有正确执行此操作的示例？
如果 AppBar 固定在页面顶部就好了。
谢谢。
它实际上按设计工作。如果你想让它固定在页面顶部，你需要将CSS位置设置为"fixed"。这会根据需要将 AppBar 粘在顶部，但由于它漂浮在那里，它可能会掩盖其下方与其自身高度相当的内容。所以，你应该用一些填充或边距（默认为 56px）来补偿它。在外部容器上使用填充的示例：
<div style={{ paddingTop: 56 }}>
<AppBar style={{ position: 'fixed', top: 0 }} />
<p>
Lots of tall/long content here...
</p>
</div>
工作 jsFiddle：https://jsfiddle.net/qe141fd2/1/