时间戳

首页 > 解决方案 > Material ui：如何使用重复键“makeStyles”？

reactjs - Material ui：如何使用重复键“makeStyles”？

问题描述

我有这种风格

    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'.

有没有合适的方法来处理这个问题？

标签： reactjsmaterial-ui

解决方案

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

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

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

background: "linear-gradient..."

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

推荐阅读