Question

如何在React中使用线性梯度供应商前缀？无需使用任何外部程序包就能做到吗？

这不起作用，因为对象不能具有相同名称的键，因此没有样式应用于div。

我不能使用类，因为我将在此代码内使用组件变量。

      const sizeBackground = {
        background: `-webkit-linear-gradient(left, #000 50%, #fff 50%)`,
        background: `-moz-linear-gradient(left, #000 50%, #fff 50%)`,
        background: `-ms-linear-gradient(left, #000 50%, #fff 50%)`,
        background: `linear-gradient(left, #000 50%, #fff 50%)`,
      }    

<div style={sizeBackground} >

Answer 1

您需要将所有内容都保留为background:的所有参数。在需要将样式添加到DOM后，在这种情况下为div。因此添加style={{background: _valueOfBackground_}}。利用此valueOfBackground的优势可以是可以放置sizeBackground;

的变量

  const sizeBackground =
     `-webkit-linear-gradient(left, #000 50%, #fff 50%)
     -moz-linear-gradient(left, #000 50%, #fff 50%)
     -ms-linear-gradient(left, #000 50%, #fff 50%)
     linear-gradient(left, #000 50%, #fff 50%)`    

<div style={{background:sizeBackground}}>

React-线性渐变内联样式供应商前缀

1 个答案: