echarts 在vuecli中使用
下载安装
npm i echarts --save-dev
常规使用方法
全局配置 (网上的通常的用法)
在main.js中进行配置
import Echarts from 'echatrs'
Vue.prototype.$echarts = Echarts;
使用ecahrts
在.vue文件的 mounted 生命周期中使用
<div id="myecharts"></div>
mounted(){
let echarts = this.$echarts.init(document.getElementById("myecharts"))
var option = {
title:{
text:'图标'
},
...
}
echarts.setOption(option)
}
借助 Vue-ECharts 的插件使用
安装下载插件
npm install vue-echarts echarts --save
如果在vue2中使用 vue-echarts , 需要单独安装一个插件 @vue/composition-api
npm i -D @vue/composition-api
配置插件
在main.js 文件中进行配置
import "echarts";
// 引入的就是 Vue-ECharts
import ECharts from 'vue-echarts'
// 注册全局的组件
Vue.component('v-chart', ECharts)