Material Ui AppBar 与 Nprogress

Question

代码：

<AppBar color='inherit' position='fixed'><AppBar>

我正在使用 Material-ui，当我在 Nextjs 应用程序中使用 nprogress和 Material ui 时，它不会显示在顶部。但是当AppBar颜色是透明时，就会显示 nprogress bar。现在，当页面转换开始时，我需要在 AppBar 顶部看到 nprogress （具有固定位置和继承颜色）。

Answer 1

根据here，AppBar的zIndex是1100，所以你可以这样做：

 <ProgressBar
            options={{showSpinner: false}}
            shallowRouting
            style={`
              #nprogress .bar {
              background: #ffffff;
              position: fixed;
              z-index: 1110 !important;
              top: 0;
              left: 0;
              width: 100%;
              height: 2px;
            }
           `}
        />