npm i vue-echarts 安装
在main.js 全局引入
import ECharts from ‘vue-echarts/components/ECharts’ 引入
require(‘echarts’);//引入所有表
Vue.component(‘chart’, ECharts) 注册组件
或者按需加载如下

在template中这样写

                <chart :options="ying" style="width: 100%;height:100%;" ref="echarts1">
                </chart>

  import ECharts from 'vue-echarts'
  import 'echarts/lib/chart/bar'
  import "echarts/lib/component/title.js";
  import "echarts/lib/component/legend.js";
  export default {
    name: '',
    components: {
      'mychart': ECharts
    },
 computed:{
     ying:function () {
       return {
           tooltip : {
             trigger: 'axis',
             axisPointer : {            // 坐标轴指示器，坐标轴触发有效
               type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
             }
           },
           grid: {
             top:'10%',
             left: '8%',
             right: '4%',
             bottom: '1%',
             containLabel: true
           },
           xAxis:  {
             type: 'value'
           },
           yAxis: {
             type: 'category',
             color:['red'],
             data: ['一营','二营','三营','四营','五营','六营','七营']
           },
           series: [
             {
               name: '直接访问',
               type: 'bar',
               stack: '总量',
               label: {
                 normal: {
                   show: true,
                   position: 'insideRight'
                 }
               },
               data: [320, 302, 301, 334, 390, 330, 320]
             },
             {
               name: '邮件营销',
               type: 'bar',
               stack: '总量',
               label: {
                 normal: {
                   show: true,
                   position: 'insideRight'
                 }
               },
               data: [120, 132, 101, 134, 90, 230, 210]
             },
             {
               name: '联盟广告',
               type: 'bar',
               stack: '总量',
               label: {
                 normal: {
                   show: true,
                   position: 'insideRight'
                 }
               },
               data: [220, 182, 191, 234, 290, 330, 310]
             }
           ]
         };

自适应，传参为echarts 的ref

Vue.prototype.echartsResize = function(ref){
      setInterval(() => {
        window.onresize = function () {
          ref.resize()
        }
      }, 100)
    }