①安装Echarts npm install echarts (有安装cnpm,用cnpm更快)
②main.js文件全局引入
import echarts from 'echarts'
Vue.prototype.$echarts = echarts
③原始模板数据放于
data() {
return {
//原始模板
option:{
……
}
}
}
④挂载渲染绘制
init() {
//确保dom元素已经挂载到页面中
this.$nextTick(() => {
this.drawLine();
})
},
drawLine() {
//渲染
let bar = this.$refs['charts']
let myChart
if (bar) {
myChart = this.$echarts.init(bar)
} else {
return
}
// 绘制图表
myChart.setOption(this.option);
},
⑤页面挂载时执行
mounted() {
this.init();
}