javascript - Styled-component 在 Internet Explorer 11 上不工作的解决方法

Question

我的网络应用程序中有样式组件。

他们工作得很好。除了在 Internet Explorer 11 上。它们完全崩溃了，布局只是一堆水平放置的组件，而不是 flexbox 等等。

解决此问题的常用方法是什么？我是否应该以某种方式在 js 代码中认识到，如果浏览器是 IE11，那么我应该只使用内联样式，或者是否有某种解决此问题的方法？我试着用谷歌搜索，但没有找到任何确定的东西。

编辑:进一步调查表明原因是这是一个 Angular 元素。实际上，这是一个带有 React View 的 Angular 元素(是的，我知道)并且 React View 使用样式组件，这在其他浏览器上工作得很好，但我们的客户只使用 IE11，所以我们必须解决这个问题或者只是放弃样式组件。

Answer 1

前一段时间有一个很好的问题:https://github.com/styled-components/styled-components/issues/657

请注意，那里的代码已经过时并且解决方案有问题，因为它可能会破坏其他保证。

但是，解决方案要么是阻止其他库卸载或改变 styled-components 样式节点，要么是更改它们，以便它们稍微更灵活地进行更改。

如果您不使用 SSR，我们即将推出一个 API，允许您使用 StyleSheetManager 指定自定义 DOM 元素以将样式标签装载到其中。您可以在 npm 上使用“dev”标签进行尝试。

除此之外，您可以修改我们的代码，这样我们就不会将元素挂载到文档头部。