如何解决第二次点击导出图形时,获取属性“正在导出”未定义
当我第二次尝试将图形导出为png时遇到问题。第一次一切都很好,但是在第二次单击时,我在控制台Cannot read property 'exporting' of undefined
中收到此错误。我正在使用React,我的代码如下所示:
const [exportGraph,setExportGraph] = React.useState<JSX.Element | null>(null);
const chartCallback = (chart: Highcharts.Chart) => {
setExportGraph(
<React.Fragment>
<ChartAction
onClick={() => {
chart.exportChart({},{});
}}
title={t('exportGraphPNG')}
iconName={EXPORT_ICON}
/>
<ChartAction
onClick={() => {
chart.downloadCSV();
}}
title={t('exportGraphCSV')}
iconName={EXPORT_ICON}
/>
</React.Fragment>
);
};
return (
...
<div>{exportGraph}</div>
...
);
在图表组件中,我已经定义了
const handleChartCallback = (chart: Highcharts.Chart) => {
enableScrollWithMouseWheel(chart);
chartCallback && chartCallback(chart);
};
return (
<HighchartsReact
constructorType={'chart'}
highcharts={Highcharts}
options={options}
callback={handleChartCallback}
/>
)
请注意,downloadCSV
在多次导出中效果很好,但仅在导出png之前有效。之后,该图表似乎以某种方式从dom中消失了。我怎样才能解决这个问题?预先感谢!
解决方法
根据注释-使用useRef
创建图表引用以获取chart
对象作为这种情况的解决方案。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。