echarts pie饼图初始化的时候没数据

原因：我们在componentDidMount生命周期里初始化了Pie（echarts的饼图）

componentDidMount() {
    this.showPieChart()
}
showPieChart = () => {
    let myChart = echarts.init(document.getElementById('PieWrap'))
    let data = this.genData()
    if (data) {
      const option = {
        title: {
          x: 'center',
        },
        tooltip: {
          trigger: 'item',
          formatter: '{a} <br/>{b} : {c}',
        },
        legend: {
          type: 'scroll',
          orient: 'vertical',
          right: 10,
          top: 20,
          bottom: 20,
          data: data.legendData,
          selected: data.selected,
        },
        series: [
          {
            name: '支出项',
            type: 'pie',
            radius: '55%',
            center: ['40%', '50%'],
            data: data.seriesData,
            itemStyle: {
              emphasis: {
                shadowBlur: 10,
                shadowOffsetX: 0,
                shadowColor: 'rgba(0, 0, 0, 0.5)',
              },
            },
          },
        ],
      }
      myChart.setOption(option, true)
    }
  }
  genData = () => {
    const { expendList } = this.props.boardForm
    let legendData = []
    let seriesData = []
    let selected = []

    expendList &&
      expendList.forEach(it => {
        legendData.push(it.name)
        seriesData.push({
          name: it.name,
          value: it.amount,
          code: it.code,
        })
      })
    console.log('legendData, seriesData, selected ', legendData, seriesData, selected)

    return {
      legendData,
      seriesData,
      selected,
    }
  }

这个时候，我们的数据还没从接口请求回来， 因此数据是空的！

等我们将数据请求回来的时候， 发现饼图并没有跟着更新数据，也就是看不见饼图了

解决：在componentWillReceiveProps（注意，请求的数据必须来自于props而非state）生命周期中再次调用初始化饼图的方法showPieChart

componentWillReceiveProps() {
    this.showPieChart()
}