使用ReactJS进行IE条件定位

Question

我正在使用ReactJS编写Web应用程序，我需要专门针对IE9及以下浏览器来排除应用类。 具体来说，我的客户端有一个他们想要使用的自定义<select>控件，并且在他们的主网站（ 不使用React ）上，他们使用条件注释来定位IE9-以不应用自定义<select>样式。 问题是， 使用ReactJS，无法进行IE条件注释 。 我做了一些google-foo，我能找到的最好的解决方案是将HTML直接注入DOM，而不是允许React处理渲染 。

<div>
    <!--[if lte IE 9]>
    <select>
    <![endif] -->
    <!--[if !IE]> -->
    <select className = "customSelect">
    <!-- <![endif] -->
        <!-- OPTIONS GO HERE -->
    </select>
</div>

有没有办法在CSS中模拟这个，或者有没有人听说过反应插件可以让我进行IE条件检查？

jsFiddle例如这里

Answer 1

其他选择：

• 使用条件编译来编写只能在IE中运行的代码（<11）
• 使用功能检测来检测IE及其版本

如果在构建过程中删除了注释，则条件编译很容易咬你，因此从长远来看，功能检测可能不那么痛苦：

var ie = require('ie-version')
...
var className = 'customSelect'
if (ie.version && ie.version <= 9) {
  className = ''
}
return <div>
  <select className={className}>
  ...
  </select>
</div>

Answer 2

let isIE = /*@cc_on!@*/false || !!document.documentMode;

<div>
  {isIE ?<div>
    Internet Explorer
  </div>:<div>
    Not Internet Explorer
  </div>}
</div>