はじめに

タイトルの通り、Popoverのcontentの背景色がなぜか真っ白になったり・ツラついたりする現象に遭遇したので、対処方法を共有します。

原因

IE11とPopoverが展開するcontainerのスタイルの指定が相性が悪いため。
デフォルトでは、containerには transform: translate3d(xxx, xxx, xxx) なスタイルが適用されています。

Popoverコンポーネントのmodifiers propsに以下のようなオブジェクトを渡すことにより、この問題を回避できます。
※IE11の場合のみ、falseにするという条件分岐を入れてもいいかと思います


const hoge = {
  computeStyle: {
   gpuAcceleration: false 
  }
}