前言
一、Echarts安装
二、Echarts引入
全量引入(可优化CDN引入,减少打包构建时间)
Vue2 直接使用this.$echarts
Vue3 可以在生命周期上使用this.$echarts
,也可 setup
使用 getCurrentInstance
获取
相比这种,咱更喜欢直接在组件内直接引入使用,不过这种全局引入可以使用CDN引入方式优化(可参考CDN引入方法)
下面咱重点说下按需引入
按需引入(加快资源加载,体积小)
1、在常量定义文件夹或者公共代码目录新建 echarts.ts
文件
即在src/const/
目录下新建echarts.ts
文件,然后引入当前项目需要的组件等,当前文章以饼状图和柱状图为例配置如下
如果有些不知道是否需要引入,且遗漏的,在页面上会出现以下错误,根据错误一个个配置好即可
在这里插入图片描述
2、引入新建的 /const/echarts.ts
3、然后根据官网提供的使用方法就可使用啦
总结
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。