类型错误：无法读取未定义的属性（读取“activeDataLabelStyle”）

Question

我的 React 页面上有一个

Highcharts

图表，我在通过更新状态挂钩获取数据后重新绘制它。这在开发模式下运行良好，没有任何问题。

但是，在 npm run build 并启动应用程序后，我收到错误：

TypeError：无法读取未定义的属性（读取“activeDataLabelStyle”）

如果我离开页面并返回，图表会更新，选择时没有任何问题，但如果我选择刷新页面后显示，仍然会抛出错误。

const [options, setOptions] = useState({
  title: {
    text: 'Speed of vehicle over time',
  },
  subtitle: {
    text: 'Select an area on the chart to zoom in.',
  },

  chart: {
    zoomType: 'x',
  },
  series: [
    {
      data: [],
    },
  ],
  xAxis: {
    type: 'datetime',
    labels: {
      formatter: function () {
        return Highcharts.dateFormat('%H:%M', this.value);
      },
    },
    title: {
      text: 'Time',
    },
  },
  yAxis: {
    title: {
      text: 'Speed (m/s)',
    },
  },
});

async function handleSelect(selected, setLoading) {
  const journey = await axios.get('/api/getJourney?id=' + selected.id);

  console.log(journey.data);

  setOptions({
    series: [
      {
        data: journey.data,
        name: 'Vehicle ' + selected.id,
      },
    ],
  });

  setLoading(false);
}

Answer 1

首先确保您已将钻取模块从

'highcharts/modules/drilldown'

导入到您的应用程序中。

并确保您在 highcharts 的任何其他模块之前导入此模块。

这个方法解决了我的问题。