Only last series updates when switching data about react-jsx-highcharts

[codingarmadillo]

import React, { Component } from 'react';
import { HighchartsChart, Chart, XAxis, YAxis, LineSeries } from 'react-jsx-highcharts';

const data1 = [
    [34.402212, 35.24466, 36.089052, 36.934568, 37.78058, 38.626772, 39.473452, 40.320504, 41.167544],
    [0, 35.24466, 36.089052, 36.934568, 37.78058, 38.626772, 39.473452, 40.320504, 0],
    [10, 35.24466, 36.089052, 36.934568, 37.78058, 38.626772, 39.473452, 40.320504, 10]
];

const data2 = [
    [4.566509, 4.4117, 4.26037, 4.113196, 3.971816, 3.837871, 3.713, 3.595715, 3.483925],
    [0, 4.4117, 4.26037, 4.113196, 3.971816, 3.837871, 3.713, 3.595715, 0],
    [2, 4.4117, 4.26037, 4.113196, 3.971816, 3.837871, 3.713, 3.595715, 2]
];

class App extends Component {
    constructor(props) {
        super(props);

        this.state = {
            series: 'data1'
        };
    }

    toggleState = () => {
        this.setState({
            series: this.state.series === 'data1' ? 'data2' : 'data1'
        });
    };

    render() {
        const data = this.state.series === 'data1' ? data1 : data2;

        console.log(data);

        return (
            <div>
                Toggle state:
                <input type='checkbox'
                       onChange={this.toggleState}/>

                <HighchartsChart>
                    <Chart/>

                    <XAxis />

                    <YAxis id='axis1'>
                        {data.map((item, index) => (
                            <LineSeries key={index}
                                        id={`series${index + 1}`}
                                        data={[ ...item ]}/>
                        ))}
                    </YAxis>
                </HighchartsChart>
            </div>
        );
    }
}

export default App;

[codingarmadillo]

I just upgraded highcharts to 6.0.1 and that seems to have fixed it.