react-highcharts: Uncaught TypeError: Cannot read property 'chart' of undefined
First of all, really nice job for wrapping highcharts as a react component, exactly what I’ve been looking for!
Following the instruction, I was able to get it up and run pretty easily. Everything works as expected, except the browser keeps throwing the following error whenever page reflows.
Uncaught TypeError: Cannot read property 'chart' of undefined
hb.reflow @highcharts.js:222
(anonymous function) @ReactHighcharts.js:1
Although it doesn’t seem to cause any real problem (the charts redraw without issue), I’d love to see a way to workaround the error. Here is the code for reference, which is pretty much the bare minimal for showing a line chart.
import React, {Component} from 'react';
import ReactHighcharts from 'react-highcharts';
export default class HighchartLine extends Component {
constructor(props) {
super(props);
}
render() {
const config = {
...... // skipping the detail here for saving space
};
return (<ReactHighcharts config = {config} />);
}
}
About this issue
- Original URL
- State: closed
- Created 8 years ago
- Reactions: 1
- Comments: 16 (8 by maintainers)
Commits related to this issue
- fix #119 (don't reflow after unmount) — committed to barracudanetworks/react-highcharts by dbergey 8 years ago
We have a similar issue. For us it happens because the reflow-call inside
requestAnimationFrame
happens aftercomponentWillUnmount
, so checking if the chart still exists in the callback might be a good idea.What triggers this in our case is that it mounts->unmounts->mounts quickly. If that is an error on our part I’m currently figuring out.
Yay it works perfectly now! Thanks a lot!
This should be fixed in 8.1.0, thanks to @dbergey