Question

这主要是为给定的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来确定浏览器然后应用正确的值似乎是太多的工作..或者有不同的方法来做到这一点？有什么想法吗？

Answer 1

如果您想使用内联样式并获得供应商前缀，您可以使用像Radium这样的库为您抽象供应商前缀。

通过向您的组件添加frag2装饰器，Radium将挂钩您传递给组件的样式并自动管理和添加前缀。

<pre><code>
public class Frag2 extends Fragment implements dialog.Communicator {

    ........

    public void showDialog() {

        FragmentManager manager = getFragmentManager();
        myDialog dialog = new myDialog();
        dialog.addCommunicator(this);
        dialog.show(manager, "dialog");
    }

    @Override
    public void respond(String type){       

        adapter.addItem(new support(type));
    }

}

Answer 2

您可以做的最好的事情是使用cursor属性创建一个css类，并将其添加到您的组件

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

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

然后在你的反应组件中：

var isGrabEnabled = true;

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

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

2 个答案: