vue中echarts的图表数据如何从后台获取请求

安装

npm install echarts -S
或者
cnpm install echarts -S

引入

let echarts = require('echarts');

创建图表

export default {
   data(){
        return{
            date:[],
            lineChart:{}
        }
     },
    mounted(){
       this.initCharts();
    },
    methods:{
         // 绘制图表
	    initCharts() {
	            let myChart = echarts.init(this.$refs.chart);
	            var option = {
	                tooltip: {},
	                xAxis: {
	                name:'日期',
	                data:this.date
	                },
	                yAxis: {
	                name:'数量'
	                },
	                legend: {
	                    left:'right',
	                    data:[
	                    {
	                        name:'当天优惠券发放的数量',
	                        icon : 'rect',
	                    },
	                    {
	                        name:'当天优惠券核销的数量',
	                        icon : 'rect',
	                    },
	                    {
	                        name:'当天优惠券过期的数量',
	                        icon : 'rect',
	                    }
	                    ]
	                },
	                series: [
	                {
	                    name: "当天优惠券发放的数量",
	                    type: "line",
	                    data: this.lineChart.data1
	                },
	                {
	                    name: "当天优惠券核销的数量",
	                    type: "line",
	                    data: this.lineChart.data2
	                },
	                {
	                    name: "当天优惠券过期的数量",
	                    type: "line",
	                    data: this.lineChart.data3
	                }
	                ]
	        };
	            myChart.setOption(option);
	        },
	        //请求后台数据
	       getLineChart(){
               //请求成功后获取数据并重新调用绘制图表方法
                this.lineChart=res.data;
                this.date=res.data.data;
                this.initCharts()
	        },
    }
 }