echarts异步数据加载

1.安装echarts插件
命令行：npm install echarts --save
2.组件导入echarts如图：运行效果：

<template>
  <div id="tu">
    <div id="lond"></div>
  </div>
</template>

<script>
import { getlond } from "../api/lond";
import * as echarts from "echarts";

export default {
  name: "tu",
  data() {
    return {};
  },
  mounted() {
    this.daxian();
  },
  methods: {
    daxian() {
      getlond().then((res) => {
        console.log(res);
        var option = {
          title: {
            text: res.data.title,
          },
          tooltip: {},
          legend: {
            data: ["销量"],
          },
          xAxis: {
            data: res.data.Result.name,
          },
          yAxis: {},
          series: [
            {
              name: "销量",
              type: "bar",
              data: res.data.Result.value,
            },
          ],
        };
        //初始化echarts实例
        var myChart = echarts.init(document.getElementById("lond"));
        //使用制定的配置项和数据显示图表
        myChart.setOption(option);
        window.onresize = function() {
          myChart.resize();
        };
      });
    },
  },
};
</script>

<style lang="less" scoped>
#lond {
  width: 400px;
  height: 400px;
  border: 1px solid red;
}
</style>

运行效果：