uniapp使用renderjs视图层向逻辑层发送自定义事件-uniapp使用renderjs视图层和逻辑层相互通讯发送数据

如果是web上,没这么麻烦,编译app后,只能这样向外发送事件。

<!-- 图例地图组件-小地图: legendMap -->
<template>
	<view id="myMapLegend" :regionChangeItem="regionChangeItem" v-show="regionChangeItem.level !== 1"
		:change:regionChangeItem="olRender.selectAdministrativeRegion" style="width: 100rpx; height: 100rpx;"
		@click="regionsBack"></view>
</template>

// 逻辑层
<script>
	export default {
		props: {
			// 行政区选择数据
			regionChangeItem: {
				type: Object,
				default: () => ({
					geom: null,
					level: 1
				})
			},
		},
		methods: {
			handleMapClick(e) {
				console.log('handleMapClick逻辑层接收到触发', e)
				this.$emit('yearValueChange', e);
			}
		},
	}
</script>

// 视图层
<script module="olRender" lang="renderjs">
export default {
		methods: {
			/**
			 * 影像点击事件
			 * 
			 * @param {Object} event
			 */
			handleMapClick(event) {
				console.log('点击:', event, event.coordinate);
				// 向逻辑层发送自定义事件
				this.$ownerInstance.callMethod('handleMapClick', event.coordinate);
			},
			selectAdministrativeRegion(e) {
				console.log('监听到逻辑层的数据变化', e)
			}
		},
	}
</script>![在这里插入图片描述](https://img-blog.csdnimg.cn/direct/a9292ce022524d39b5d2227c26c1371a.png)

Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐