如何更改按钮颜色 onClick Material-UI, React

【问题标题】：How to change Button Color onClick Material-UI, React如何更改按钮颜色 onClick Material-UI, React
【发布时间】：2020-07-29 01:20:42
【问题描述】：

我正在做一个小项目，想在单击按钮时更改按钮的颜色。我不知道该怎么做，如果有任何帮助，我将不胜感激。我正在使用 React 并使用 Material-UI 库进行样式设置。

谢谢

【问题讨论】：

标签： reactjs material-ui styling

【解决方案1】：

import React from "react";
import Button from "@material-ui/core/Button";

export default function ButtonClick() {
  const [flag, setFlag] = React.useState(true);

  const handleClick = () => {
    setFlag(!flag);
  };

  return (
    <Button
      onClick={handleClick}
      variant="contained"
      color={flag ? "primary" : "secondary"}
    >
      button
    </Button>
  );
}

【讨论】：

【解决方案2】：

使用任一

创建主题 - https://material-ui.com/customization/palette/
makeStyles - https://material-ui.com/styles/basics/

【讨论】：