如何在JSS格式上编写多个CSS属性?

Question

我想为我目前的工作做一些解决方法，需要实现它才能在iOS 9.3及其前身上获得正确的结果。

它需要修复以下 CSS 行：

.wrapping-element {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}

我想把它变成JSS。我的尝试是这样的：

const styles = {
root: {
display: '-webkit-box',
display: '-moz-box',
display: '-ms-flexbox',
display: '-webkit-flex',
display: 'flex',
}
};

但这似乎不是这样做的正确方法。因为 eslint 使这是一个错误，因为它有多个键。因为它是一个对象，所以只应用最后一个键：值。中医国际

Answer 1

我今天自己也遇到了这个问题，经过一番挖掘，我发现这可以使用回退来实现：

const styles = {
root: {
display: 'flex',
fallbacks: [
{ display: '-webkit-box' },
{ display: '-moz-box' },
{ display: '-ms-flexbox' },
{ display: '-webkit-flex' }
]
}
}

这将输出：

.root {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
}