11

我想为我当前的工作做一些变通方法,这些工作需要实现,以便在 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 因为它有多个键而使它成为一个错误。因为它是一个对象,所以只有最后一个 key:value 被应用。CMIIW

4

1 回答 1

5

我今天自己也遇到了这个问题,经过一番挖掘后,我发现这可以使用Fallbacks来实现:

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;
}
于 2018-09-08T09:18:22.220 回答