vue中使用echarts畫折線圖，為什么數(shù)據(jù)不顯示？

問題描述

新手求教，Vue中用Echarts做折線圖，數(shù)據(jù)是后臺(tái)Ajax傳過來的，可是數(shù)據(jù)根本不顯示，請問這是怎么回事？

問題出現(xiàn)的環(huán)境背景及自己嘗試過哪些方法

數(shù)據(jù)是后臺(tái)Ajax傳過來的，后臺(tái)接口用Django寫的，通過props傳給子組件，子組價(jià)中也接受得到數(shù)據(jù)，可是傳到Echarts的data中數(shù)據(jù)就失效了？

相關(guān)代碼

<template>
    <div id="chart" style="height:400px;width:100%;"></div>
</template>

<script>
export default {
  props: {
    time: {
      type: Array
    },
    stock: {
      type: Array
    }
  },
  data: function () {
    return {
      myChart: '',
      option: {
        title: {
          text: '庫存變化表'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross'
          }
        },
        toolbox: {
          show: true,
          feature: {
            saveAsImage: {}
          }
        },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: this.time
        },
        yAxis: {
          type: 'value',
          axisLabel: {
            formatter: '{value} 件'
          },
          axisPointer: {
            snap: true
          }
        },
        series: [
          {
            name: '庫存',
            type: 'line',
            color: 'green',
            smooth: true,
            data: this.stock
          }
        ]
      }
    }
  },
  created () {
  },
  mounted () {
    this.drawLine()
  },
  methods: {
    drawLine: function () {
      this.myChart = this.$echarts.init(document.getElementById('chart'))
      this.myChart.setOption(this.option)
    }
  }
}
</script>

你期待的結(jié)果是什么？實(shí)際看到的錯(cuò)誤信息又是什么？

沒有任何報(bào)錯(cuò)信息,正常結(jié)果是這樣的：

頁面刷新后：