标签:efault bsp 数据 update imp 如何使用 ted art null
在vue中使用echarts主要是注意如何与vue生命周期相结合,从而做到数据驱动视图刷新
主要是以下几步:
模板vue文件如下:
<template>
<div id="myChart" ref="myChart"></div>
</template>
<script>
import echarts from ‘echarts‘
export default {
data(){
return {
chart:null,
option:{
//echarts配置项
}
}
},
methods:{
initData(){//去请求初始化数据
},
initEcharts(){//初始化dom
let dom = this.$refs.myChart;
this.chart=echarts.init(dom);
},
drawEcharts(){//绘制echarts
this.chart.setOption(this.option);
},
},
mounted(){
this.initData();
this.initEcharts();
},
updated(){
this.drawEcharts();
}
}
</script>
标签:efault bsp 数据 update imp 如何使用 ted art null
原文地址:https://www.cnblogs.com/wuguanglin/p/EchartAndVue.html