material-ui - 材质 UI 上 makeStayles 上的 transitionDelay

Question

const useStyles = makeStyles({
  buttonStyle: {
    background: "red",

    "&:hover": {
      transitionDelay: '1',
      transform: "scale(1.1)",
      background: "red",
    },
  },
});

我如何在 makeStyles 上实现我的 transitionDelay？这没有用。

Answer 1

你在这里遗漏了一些东西：

1. 您需要遗嘱适用的transitionProperty。transitionDelay在您的情况下，它是transformCSS 属性。
2. 您transitionDelay需要包括延迟单位，例如1s或1000ms。
3. 如果您想在按钮未处于悬停状态时对其应用转换，则将样式应用于按钮而不是&:hover.

这就是它的样子：

const useStyles = makeStyles({
  buttonStyle: {
    background: "red",
    transitionProperty: "transform",
    transitionDelay: "1s",
    
    "&:hover": {
      transform: "scale(1.1)",
      background: "red",
    },
  },
});