Uniapp中使用Echarts

下载 mpvue-echarts npm下载依赖
下载 echarts.js 引用进来

import * as echarts from '@/components/echarts/echarts.simple.min.js';
import mpvueEcharts from '@/components/mpvue-echarts/src/echarts.vue';

视图层

 <view class="container"> <mpvue-echarts :echarts="echarts" @onInit="lineInit" canvasId="bar" ref="lineChart" /> </view>

逻辑层

 lineInit(e) { var lineOption={} let { width, height } = e; let canvas = this.$refs.lineChart.canvas; echarts.setCanvasCreator(() => canvas); this.lineChart = echarts.init(canvas, null, { width: width, height: height }) canvas.setChart(this.lineChart) // lineChart.setOption(lineOption) // this.$refs.lineChart.setChart(lineChart); },