vue结合echart写个柱状图demo

好的，以下是一个简单的 Vue+Echarts 柱状图 Demo：

<template>
  <div ref="chart" style="height: 400px;"></div>
</template>

<script>
import echarts from 'echarts'

export default {
  mounted() {
    // 初始化echarts实例
    const myChart = echarts.init(this.$refs.chart);

    // 指定图表的配置项和数据
    const option = {
      title: {
        text: '柱状图示例'
      },
      tooltip: {},
      xAxis: {
        data: ['A', 'B', 'C', 'D', 'E', 'F']
      },
      yAxis: {},
      series: [{
        name: '销量',
        type: 'bar',
        data: [5, 20, 36, 10, 10, 20]
      }]
    };

    // 使用刚指定的配置项和数据显示图表。
    myChart.setOption(option);
  }
};
</script>

这个 Demo 中，我们首先在 `mounted` 生命周期中获取了 DOM 元素 `chart` 的引用，并使用 `echarts.init()` 方法初始化了一个 Echarts 实例。然后我们定义了一个 `option` 配置对象，其中包含了图表的基本配置信息，包括标题、提示框、坐标轴、系列等。最后，我们使用 `myChart.setOption(option)` 方法将 `option` 配置对象应用到图表中，就可以显示出一个简单的柱状图了。需要注意的是，这里的数据是写死的，实际应用中可以通过 AJAX 异步请求数据后再进行渲染。