1.安装echarts依赖 npm install echarts --save
2.在main.js中全局中引用
因为echarts 也不能通过 Vue.use() 进行全局调用,通常是在要使用echart的文件直接引入或者在main.js中引入,
import echarts from 'echarts'
3.在main.js中修改原型链,挂载到原型链之后就可以这样初始化。this.$echarts.init
Vue.prototype.$echarts = echarts
4.在需要用到echart的地方先设置一个div的id、宽高,
例子:
<div ref="chart" style="width:90%;height:400px"></div>
5.然后我们要在mounted生命周期函数中实例化echarts对象。因为我们要确保dom元素已经挂载到页面中。
mounted(){
this.getEchartData()
},
methods: {
getEchartData() {
const chart = this.$refs.chart
if (chart) {
const myChart = this.$echarts.init(chart)
const option &#