老师我想问一下，echart数据的问题

Question

现在通过api能够正确获取到数据，但当把数据放在series中的data时，再进行一次刷新数据就会失效，图表就无法正确展示。
想问一下老师，这是什么原因造成的，谢谢老师

Answer 1

提问者 慕UI8195017 2021-04-22 22:28:41

<template>
  <common-card title="累计订单量" :value="totalOrders_total">
    <template v-slot:chart>
      <div id="totalOrdersChart" :style="{width:'100%', height:'100%'}"></div>
    </template>
    <template v-slot:footer>
      <span>昨日订单量:</span>
      <span class="emphasis">{{totalOrders_yesterdayTotal}}</span>
      <!-- <span class="emphasis">{{orderTrend}}</span> -->
    </template>
  </common-card>
</template>
<script>
import commonCardMixin from '../../../mixins/commonCardMixin'
import commonDataMixin from '../../../mixins/commonDataMixin'
import commonApiMixin from '../../../mixins/commonApiMixin'

const echarts = require('echarts')
export default {
  mixins: [commonCardMixin, commonDataMixin, commonApiMixin],
  mounted () {
    const chartDom = echarts.init(
      document.getElementById('totalOrdersChart')
    )
    // console.log(this.orderTrend)
    chartDom.setOption({
      xAxis: {
        type: 'category',
        show: false
      },
      yAxis: {
        show: false
      },
      grid: {
        top: 0,
        bottom: 0,
        right: 0,
        left: 0
      },
      series: [{
        type: 'line',
        lineStyle: {
          width: 0
        },
        itemStyle: {
          opacity: 0
        },
        data: this.orderTrend,
        areaStyle: {
          color: 'purple'
        },
        smooth: true
      }]
    })
  }
}
</script>
<style lang="scss" scoped>
@import "../../../style/mixins.scss";

.emphasis {
  @include commonEmphasis;
}
</style>
老师我的api调用的那个模块命名可能和老师的不一样，但效果是一样，同样也是得到orderTrend，但我因为开发的是vue3.x的版本，所以没有使用v-chart

Answer 2

扬_灵 2021-04-22 17:59:05

同学你好，可以把你的代码上传一下，我在本地帮你测试一下。

• 提问者 慕UI8195017 #1

  上传在哪里啊老师

• 扬_灵 回复 提问者 慕UI8195017 #2

  同学你好，代码上传到github或是码云这些代码托管平台都可以，把地址发我一下，我在本地帮你测试定位一下问题。

• 提问者 慕UI8195017 回复 扬_灵 #3

  https://github.com/tangjy149/datav-report-dev
  老师这是我的代码，麻烦老师了

点开查看后面3条评论