vue2.5 echarts 5学习

安装整体引入echarts 5

npm install echarts --save 或者淘宝镜像安装 cnpm install echarts --save

vue中main.js中整体引入echarts 5（文件会较大）*

import * as echarts from echarts
Vue.prototype.$echarts = echarts;

备注：此处导入和 echarts 4中不同 如果按照echarts 4中

import echarts from echarts;
Vue.prototype.$echarts = echarts;

导入会无法显示表格控制台会报init错误

vue请求本地cvs文件内数据

核心语句 this.$http.get（） cvs文件内容如下： vue 文件中

<template>
      </div>
      	<!--显示列表内容-->
     	{
         
  {chartcvsmsg}}

    </div>
</template>

vue 文件script（以下为不完整代码）中：

data(){
          return{
            chartsstr:,
            chartcvsmsg:[],
            }
       }
methods:{
          getchartscvs(){
            // console.log(我准备执行 );
            //获取cvs文件地址，得到res内容
            //../../static/chartssjcvs/20210414-1.csv为本地文件地址，同样可以获取来自http的内容
            this.$http.get(../../static/chartssjcvs/20210414-1.csv).then((res)=>{
              // 替换cvs文件中的换行符，chartsstr为data自定义空字符串
              this.chartsstr=res.body.replace(/
/g,,);
              //字符串文件以，分隔并转为数组，chartcvsmsg自定义空列表
              this.chartcvsmsg=this.chartsstr.split(,)
            },function (err) {
              console.log(err);
            })
          }
 }

下次讲将获取的内容丢到echarts的option里面画在div里面