【vue项目问题解决】echars,使用中提示undefined问题及重绘问题

记录在项目开发过程中遇到的小问题,欢迎大家一起留言探讨

1、问题 :引入echars,使用中提示undefined问题

问题描述

cnpm安装了echars,在main.js中全局引入,之后提示echarsundefined

期望效果

可以在组件中直接通过this.$echarts使用

正确引入方式

局部引入,组件中直接引入 import echarts from "echarts";

安装

cnpm install echars -S

引入
// 引入echarts
import echarts from 'echarts'
Vue.prototype.$echarts = echarts
使用
// 数据定义
data () {
	return {
		divHeight: 700,
	}
}
//绘画图表--可以获取自定义的值,也可以直接写死宽高
<div id="main1" ref="main" :style="{ height: divHeight + 'px' }"></div>
var chartDom = document.getElementById("main");
// 保存mychart
this.myChart = this.$echarts.init(chartDom);

2、问题 :echarts重绘

在开发过程中,难免会遇到改变图表的宽高并且重绘的功能,直接修改高度,我们会发现并不会进行重绘,使用以下命令即可:

this.myChart.resize({ height: this.divHeight });
上一篇:uni-app编译完成微信小程序开发工具中报错TypeError: Cannot read property ‘forceUpdate‘ of undefined


下一篇:第三十二篇:vue的响应式原理