如何解决Recharts 2.0.8 <ResponsiveContainer> </ResponsiveContainer> 不适用于 IE11
我遇到了无法在 IE11 中使用 Rechart 的 <ResponsiveContainer></ResponsiveContainer>
的问题。
<ResponsiveContainer width="100%" height={x + (y ? 10 : 0)}>
<BarChart...>
</BarChart>
</ResponsiveContainer>
虽然上面的代码适用于其他浏览器,但对于 IE 11,我得到以下错误:
组件出现上述错误: 在 ResizeDetector 中(由 ResponsiveContainer 创建) 在 ResponsiveContainer 中(在 chart-widget.tsx:286) 在 div 中(在 chart-widget.tsx:285)
一旦我将 <ResponsiveContainer></ResponsiveContainer>
标签更改为如下简单的 <div></div>
标签,图表就会在 IE11 中正确呈现。
<div width="100%" height={x + (y ? 10 : 0)}>
<BarChart...>
</BarChart>
</div>
任何人都可以帮助我为什么 <ResponsiveContainer>
标记在 IE11 中不起作用以及如何使其起作用?
提前致谢
解决方法
我尝试使用 recharts@2.0.8
,但遇到了同样的错误。出现错误是因为 ResizeDetector
使用了 IE 不支持的 ResizeObserver。使用此polyfil可以解决问题:
npm install resize-observer-polyfill
在你的 index.js 中:
import 'resize-observer-polyfill/dist/ResizeObserver.global'
有了recharts@2.0.9
,问题就解决了。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。