使用echarts-for-react时更新数据方法总结

目录

使用echarts-for-react时更新数据方法总结

效果预览

使用Echarts API更新

• 在ReactEcharts组件中，设置ref属性，传入回调函数，获取ref

  

• 在React的生命周期方法componentDidMount中，获取echarts实例，利用 setOptionAPI更新数据

  

• 完整代码

  

• 文字版

  import React, {
        Component } from 'react';
  import ReactEcharts from 'echarts-for-react';
  
  const pieOption = {
       
      color: ['#ff884a', '#ffba56', '#0099dd', '#36cb98'],
      series: [
          {
       
              type: 'pie',
              radius: ['40%', '70%'],
              avoidLabelOverlap: false,
              data: [0, 0, 0,