feat: update

components/LineMixBar/LineMixBar.vue

@@ -19,55 +19,54 @@
 		data() {
 			return {
 				ec: {
-					lazyLoad: true
+					lazyLoad: true,
+					option: {}
 				}
 			}
 		},
 		components: {
 			uniEcCanvas
 		},
+		mounted() {
+			this.$refs['lineMixBarCanvas'].init(this.inited)
+		},
 		methods: {
-			initChart() {
-				const that = this
-				that.$nextTick(() => {
-					that.$refs['lineMixBarCanvas'].init((canvas, width, height, canvasDpr) => {
-						chart = that.$echarts.init(canvas, null, {
-							width: width,
-							height: height,
-							devicePixelRatio: canvasDpr
-						})
-						canvas.setChart(chart)
-						const {
-							dataList: {
-								categories,
-								series
-							}
-						} = that.elementData
-						const options = {
-							...that.elementInfo.option,
-							tooltip: {},
-							xAxis: {
-								...that.elementInfo.option.xAxis,
-								data: categories
-							},
-							yAxis: [{
-									...that.elementInfo.option.yAxis,
-									type: 'value'
-								},
-								{
-									...that.elementInfo.option.yAxis,
-									type: 'value'
-								}
-							],
-							series: that.dealSeriesData(series)
+			inited(canvas, width, height, canvasDpr) {
+				chart = this.$echarts.init(canvas, null, {
+					width: width,
+					height: height,
+					devicePixelRatio: canvasDpr
+				})
+				canvas.setChart(chart)
+				const {categories, series} = this.elementData.dataList
+				this.ec.option = {
+					...this.elementInfo.option,
+					tooltip: {},
+					xAxis: {
+						...this.elementInfo.option.xAxis,
+						data: categories
+					},
+					yAxis: [{
+							...this.elementInfo.option.yAxis,
+							type: 'value'
+						},
+						{
+							...this.elementInfo.option.yAxis,
+							type: 'value'
 						}
-						chart.setOption(options)
-						chart.on('click', event => {
-							that.handleEchartsClick(event)
-						})
-						return chart
-					})
+					],
+					series: this.dealSeriesData(series)
+				}
+				chart.setOption(this.ec.option)
+				chart.on('click', event => {
+					this.handleEchartsClick(event)
 				})
+				return chart
+			},
+			initChart() {
+				const {categories, series} = this.elementData.dataList
+				this.$set(this.ec.option, 'xAxis.data', categories)
+				this.$set(this.ec.option, 'series', this.dealSeriesData(series))
 			},
 			/**
 			 * 处理数据

components/NormalGauge/NormalGauge.vue

@@ -20,7 +20,8 @@ export default {
 	data() {
 		return {
 			ec: {
-			  lazyLoad:true
+			  lazyLoad:true,
+			  option: {}
 			}
 		};
 	},
@@ -28,39 +29,36 @@ export default {
 	components: {
 	  uniEcCanvas
 	},
-	
+	mounted() {
+		this.$refs['normalGaugeCanvas'].init(this.inited)
+	},
 	methods: {
-		initChart() {
-			const that = this
-			that.$nextTick(() => {
-				that.$refs['normalGaugeCanvas'].init((canvas, width, height, canvasDpr) => {
-					chart = that.$echarts.init(canvas, null, {
-						width: width,
-						height: height,
-						devicePixelRatio: canvasDpr
-					})
-					canvas.setChart(chart)
-					const { dataList: { guageChart } } = that.elementData
-					const options = {
-						...that.elementInfo.option,
-						tooltip: {
-						    formatter: '{a} <br/>{b} : {c}%'
-						},
-						series: [{
-						    type: 'gauge',      
-						    radius: '90%',
-						    data: guageChart
-						}]
-					}
-					chart.setOption(options)
-					return chart
-				})
+		inited(canvas, width, height, canvasDpr) {
+			chart = this.$echarts.init(canvas, null, {
+				width: width,
+				height: height,
+				devicePixelRatio: canvasDpr
 			})
+			canvas.setChart(chart)
+			const { guageChart } = this.elementData.dataList
+			this.ec.option = {
+				...this.elementInfo.option,
+				tooltip: {
+				    formatter: '{a} <br/>{b} : {c}%'
+				},
+				series: [{
+				    type: 'gauge',      
+				    radius: '90%',
+				    data: guageChart
+				}]
+			}
+			chart.setOption(this.ec.option)
+			return chart
+		},
+		initChart() {
+			const { guageChart } = this.elementData.dataList
+			this.$set(this.ec.option, 'series[0].data', guageChart)
 		}
 	}
 }
 </script>
-
-<style>
-
-</style>

components/NormalRadar/NormalRadar.vue

@@ -19,47 +19,46 @@
 		data() {
 			return {
 				ec: {
-					lazyLoad: true
+					lazyLoad: true,
+					option: {}
 				}
 			}
 		},
 		components: {
 			uniEcCanvas
 		},
+		mounted() {
+			this.$refs['normalRadarCanvas'].init(this.inited)
+		},
 		methods: {
-			initChart() {
-				const that = this
-				that.$nextTick(() => {
-					that.$refs['normalRadarCanvas'].init((canvas, width, height, canvasDpr) => {
-						chart = that.$echarts.init(canvas, null, {
-							width: width,
-							height: height,
-							devicePixelRatio: canvasDpr
-						})
-						canvas.setChart(chart)
-						const {
-							dataList: {
-								indicator,
-								series
-							}
-						} = that.elementData
-						const config = {
-							tooltip: {},
-							radar: {
-								indicator
-							},
-							series: [{
-								type: 'radar',
-								label: {
-									...that.elementInfo.option.dataset
-								},
-								data: that.dealSeriesData(series)
-							}]
-						}
-						chart.setOption(config)
-						return chart
-					})
+			inited(canvas, width, height, canvasDpr) {
+				chart = this.$echarts.init(canvas, null, {
+					width: width,
+					height: height,
+					devicePixelRatio: canvasDpr
 				})
+				canvas.setChart(chart)
+				const {indicator, series} = this.elementData.dataList
+				this.ec.option = {
+					tooltip: {},
+					radar: {
+						indicator
+					},
+					series: [{
+						type: 'radar',
+						label: {
+							...this.elementInfo.option.dataset
+						},
+						data: this.dealSeriesData(series)
+					}]
+				}
+				chart.setOption(this.ec.option)
+				return chart
+			},
+			initChart() {
+				const {indicator, series} = this.elementData.dataList
+				this.$set(this.ec.option, 'radar', { indicator })
+				this.$set(this.ec.option, 'series[0].data', this.dealSeriesData(series))
 			},
 			/**
 			 * 处理数据
@@ -80,6 +79,4 @@
 			}
 		}
 	}
-</script>
-<style scoped>
+</script>
\ No newline at end of file
-</style>

components/RemoteImage/RemoteImage.vue

@@ -3,7 +3,7 @@
 		<NormalTitle :elementInfo="elementInfo"></NormalTitle>
 	  <u-image
 			class="remoteImage"
-			:src="imageUrl"
+			:src="elementData.dataList.imageUrl"
 			width="100%"
 			height="100%"
 			mode="aspectFit"
@@ -17,18 +17,8 @@
 	export default {
 		name:"RemoteImage",
 		mixins: [echartElementData],
-		data() {
-			return {
-				imageUrl:""
-			};
-		},
 		methods:{
-			initChart() {
-				const that = this
-				that.$nextTick(() => {
-					that.imageUrl = that.elementData.dataList.imageUrl
-				})
-			}
+			initChart() {}
 		}
 	}
 </script>