reactjs - Material-ui Snackbar 改变颜色而不为每种颜色制作一个新的颜色？

Question

如何更改 snackbar 的颜色，而不必在 Material 用户界面中创建新的颜色，我是否必须为每种颜色创建一个新的颜色？在示例沙箱中，它们只有一种颜色，其他颜色是静态的

Answer 1

你不需要创建不同的组件，你所要做的就是使用钩子(Hook)传递属性来修改组件

 <Snackbar open={open} autoHideDuration={6000} onClose={handleClose}>
    <Alert onClose={handleClose} severity={severity}>
    {message}
    </Alert>
    </Snackbar>

就像这样，您可以在一个组件中传递您想要的消息和您想要的严重性 这是一个工作示例

https://codesandbox.io/s/delicate-frost-itv99

编辑:

正如 Dekel 指出的 <Alert>是一个不同的组件，它是接收严重性和消息的组件。