如何在React中将多个特定于浏览器的值添加到CSS样式中？

这主要是为给定CSS属性定义特定于浏览器的值，如下所示：

<div style="cursor: -moz-grab; cursor: -webkit-grab; cursor: grab;">Grab me!</div>

抓住我！ 如果我像这样将其包装到对象中：

<div style={{
    cursor: "-moz-grab",
    cursor: "-webkit-grab",
    cursor: "grab"
}}>Grab me!</div>

抓住我！ 然后在对象中复制关键点（在严格模式下会失败，否则会覆盖）。简单地将所有值放入单个字符串似乎也不起作用

---

用JS计算出浏览器，然后应用正确的值，这似乎是太多的工作了。。还是有不同的方法来做到这一点？有什么想法吗？

如果您想使用内联样式并获得供应商前缀，您可以使用类似库的方法为您提取供应商前缀

通过向组件添加一个

@Radium

装饰器，Radium将连接到传递给组件的样式中，并自动管理和为它们添加前缀

var Radium = require('radium');
var React = require('react');

@Radium
class Grabby extends React.Component {
  render() {
    return (
      <div style={style}>
        {this.props.children}
      </div>
    );
  }
}

var style = {
  cursor: "grab" // this will get autoprefixed for you!
};

var Radium=require（'Radium'）；
var React=要求（'React'）；
@镭
类抓取扩展了React.Component{
render（）{
返回(
{this.props.children}
);
}
}
变量样式={
光标：“抓取”//这将为您自动修复！
};

您最好使用cursor属性创建一个css类，并将其添加到组件中

.container {
  height: 10px;
  width: 10px;
}

.grab {
  cursor: -moz-grab,
  cursor: -webkit-grab,
  cursor: grab,
}

然后在react组件中：

var isGrabEnabled = true;

<div className={['container', (isGrabEnabled ? 'grab' : '')]}>Grab me!</div>

var isgrabbenabled=true；
抓住我！

我想您需要它作为字符串<代码>变量样式='光标：“-moz-grab”，光标：“-webkit-grab”，光标：“grab”；回来抓我也许不是最好的方法，但我想不出其他方法。您还应该查看autoprefixer@alexmngn：在react中，您不能将样式作为字符串传递。。这是唯一的目标，不是吗？是的，这就是我现在要做的工作，但这不是react背后的想法。。从我的理解来看，一切都应该是独立的，这就是我试图做的：）我同意。自动刷新是最好留给构建工具的任务。