Material-UI の Dialogのスタイルを変更する方法

はじめに

Material-UIで画像をモーダルで表示したい時に、やり方を探したのでメモとして残します。

やり方

PaperPropsにstyleを渡す。

import { Dialog } from "@material-ui/core";

...
const [showingDialog, setShowingDialog] = useState(false);
...

<Dialog
  onClose={() => setShowingDialog(false)}
  open={showingDialog}
  scroll="body"
  PaperProps={{
    style: {
      backgroundColor: "transparent",
      boxShadow: "none",
      textAlign: "center",
    },
  }}
>
  <img src="image url" />
</Dialog>
...