材质UI Snackbar重叠

Question

我正在使用Material UI Snackbar。我对Material UI不是很新，但不知怎的，我无法解决问题，即当小吃栏出现在屏幕顶部时，它会重叠。我尝试了不同的方法来解决它，但没有运气。

请在下面找到Snackbar组件及其体型。另请查看此截图：

python3 app.py 2>&1 | tee -a application.log

Answer 1

我使用react和Material UI遇到了这个问题，当引入两个快餐栏时，一个彼此重叠。我解决了在index.css中修改mui根快餐栏的第二个孩子的问题

#root .MuiSnackbar-anchorOriginBottomCenter:nth-child(2){
    bottom: 92px!important;
}

这显然取决于您为小吃店选择的位置，并相应地进行调整

Answer 2

仅从屏幕截图中，我无法告诉100％，但似乎您刚刚使Snackbar透明了：

backgroundColor: 'transparent'

所以你实际上正在看通过它。

要解决此问题，您应该为组件指定backgroundColor，或者删除“透明”组件。覆盖，例如：

backgroundColor: '#bada55'

您可能需要查看withStyles/withTheme HOC，以便在一个地方声明您的颜色，并在不同的组件中重复使用它们，在这种情况下，您将会遇到以下情况：

backgroundColor: theme.palette.my.predefined.color