VUE3 + TS 引入echarts笔记

使用vue3+ts创建的h5项目,需要引入echarts。

上干货:

按需引入echarts : 这里echarts版本为5.X

import * as echarts from 'echarts'

 创建html元素

在setup()创建方法(在onMounted中写也行,看个人喜好)

// 基于准备好的dom,初始化echarts实例
      let myChart = echarts.init(document.getElementById('myChart'))

这里ts会报一个错:

VUE3 + TS 引入echarts笔记_第1张图片

 解决办法:

let myChart = echarts.init(document.getElementById('myChart') as HTMLCanvasElement)

解决!

VUE3 + TS 引入echarts笔记_第2张图片

你可能感兴趣的:(vue.js,echarts,前端)