Vue使用echarts的两种方案

1. 前提

首先在使用echarts的时候,要确保echarts的版本
需要挂载在mounted上面

2. 安装

npm i echarts@x.x.x --save

ts使用 npm i @types/echarts@x.x.x --save,上面的方法也可以

3. 使用方式

3.1 全局

  1. js

文件为main.js

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

// 使用方式
// 例
this.$echarts.setOption()
  1. ts
    修改文件main.ts,同级新建文件shim-echarts.d.ts
import echarts from "echarts"

// shim-echarts.d.ts文件内容
import Vue from 'vue'

declare module 'vue/types/vue' {
    interface Vue {
      $echarts: any
    }
}

3.2 文件内部使用

缺点:若使用次数多,则需要反复声明

import echarts from "echarts"
echarts.setOption()
谁不是孤身一人,翻山越岭
原文地址:https://www.cnblogs.com/hasz/p/14326385.html