记录vue+ts项目引入echarts方法

第一种

indext.html中用script引入

<script src="https://cdn.bootcss.com/echarts/4.2.1-rc1/echarts-en.common.min.js"></script>

组件中调用方式

<script >
import { Component , Vue } from 'vue-property-decorator';
declare let echarts:any;  //要先声明
@Component
export default class about extends Vue{
  private mounted(): void{
      this.ech();
  };
  private ech(): void{
    let lineChart =echarts.init(document.getElementById('lineChart'));

}

第二种

npm install echarts --save 
npm install @types/echarts --save

在main.ts中添加如下代码

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

第三种

在项目根目录创建一个shims-echart.d.ts文件

 import Vue from 'vue';

   declare module 'vue/types/vue' {
       interface Vue {
       
攻城狮Lee丶 CSDN认证博客专家 小区编程大赛银奖 幼儿园网络顾问 植发门店终身会员
一个奇葩的程序员,外冷内热,有点闷骚 ,生活状态下是个逗比,工作时是个完美主义者。....................
©️2020 CSDN 皮肤主题: 猿与汪的秘密 设计师:上身试试 返回首页
实付 19.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值