由于传统web端的echarts使用方式在真机运行时报错,以下是解决方式:

<view :prop="options" :change:prop="echarts.updateEcharts" id="line"></view>

注意:options需要定义在data中,赋值可以在mounted,也可以直接写在data

<script module="echarts" lang="renderjs">
	let myChart
	export default {
		mounted() {

			if (typeof window.echarts === 'function') {
				this.initEcharts();
			} else {
				// 动态引入较大类库避免影响页面展示
				const script = document.createElement('script')
				// view 层的页面运行在 www 根目录,其相对路径相对于 www 计算
				script.src = 'static/js/echart/echarts.js';//你的项目中echarts.js的路径
				script.onload = this.initEcharts.bind(this);
				document.head.appendChild(script);
			}

		},
		methods: {

			initEcharts: function() {
				// this.chart2 = this.load_echart(this.setChartBar(data2), 'canvasLineBar');
				myChart = echarts.init(document.getElementById('line'));
				// 观测更新的数据在 view 层可以直接访问到
				myChart.setOption(this.options);
			},

			updateEcharts(newValue, oldValue, ownerInstance, instance) {
				// 监听 service 层数据变更
				if (myChart !== "") {
					myChart.setOption(newValue, true)//如果需要频繁的更新数据且更新图表,建议加上true
				}

			},

		}

	}
</script>

hbuilderX内置浏览器运行报错

##1、[system] ReferenceError: plus is not defined
问题不大,别慌。不影响你的工作。plus,需要在移动端可以使用

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐