Javascript MaterialUI:盒子在重新加载时会丢失背景

我正在尝试将背景色应用于一个图像。在我重新加载页面之前，它一直有效：重新加载后，背景色丢失。我使用Next.js创建我的应用程序

但是，每当我向页面添加另一个组件时，颜色就会重新出现。因此，似乎从Next.js重新加载会使背景色恢复

代码如下：

import Box from "@material-ui/core/Box";
import Typography from "@material-ui/core/Typography";

export default function Test() {
    return (
        <Box bgcolor="primary.main" align="center">
            <Typography>Test</Typography>
        </Box>
    );
}

从“@material ui/core/Box”导入框；
从“@material ui/core/Typography”导入排版；
导出默认函数测试（）{
返回(
试验
);
}

下面是一个显示结果的短GIF：

---

它不会迷路，只是会被耽搁。通过查看文档，bgcolor不是一个可以向下传递的属性。它们确实在文档中使用bgcolor属性：。然而，当我复制他们的例子时，我没有得到他们显示的结果，背景色没有显示…它没有丢失，只是被延迟了。通过查看文档，bgcolor不是一个可以向下传递的属性。它们确实在文档中使用bgcolor属性：。然而，当我复制他们的例子时，我不会得到他们显示的结果，背景色不会显示。。。