Question

我有这种风格

    background:
      "-moz-linear-gradient(180deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.5) 66%, rgba(0,0,0,0) 100%)",
    background:
      "-webkit-linear-gradient(180deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.5) 66%, rgba(0,0,0,0) 100%)",
    background:
      "linear-gradient(180deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.5) 66%, rgba(0,0,0,0) 100%)",

使用makeStyles创建样式后，React抱怨Duplicate key 'background'。

有没有适当的方法来解决这个问题？

Answer 1

material-ui会自动应用供应商前缀。根据文档：

JSS使用功能检测来应用正确的前缀。如果您在最新版本的Chrome中看不到特定的前缀，请不要感到惊讶。您的浏览器可能不需要它。

只保留对象中的最后一个键：

background: "linear-gradient..."

https://material-ui.com/styles/advanced/#css-prefixes

材料UI：如何使用重复键`makeStyles`？

1 个答案: