uniapp微信小程序地图marker自定义气泡 customCallout偶尔显示不全解决办法

这个天坑问题,在微信开发工具上是不会显示出来的,只有在真机上才会偶尔出现随机样式偏移/裁剪/宽长偏移,询问社区也只是让你提交代码片段,并无解决办法。

一开始我怀疑是地图组件加载出现了问题,于是给地图加了一个v-if="reLoad"默认值false,等页面加载完成再渲染地图

typescript 复制代码
onReady(){
			this.reLoad = true
			this.mapCtx = uni.createMapContext("myMap")
},

结果发现还是会出现这个问题。

然而当我尝试给点击事件添加地图this.reLoad = false ;...this.reload = true的时候,变形的marker居然正常了!!!

但是,通过重载地图的方式在地图上有逻辑时改动会相当麻烦,而且也不好判断该在什么时候重载。在经过大量调试后发现

在地图渲染后赋值marker时

typescript 复制代码
// 地图渲染完成
			mapUpDate(e) {
				this.mapTime = this.mapTime + 1
				if(this.mapTime == 3){
					.....
					this.markers = markers
					setTimeout(()=>{
						this.markers = []
						this.$nextTick(()=>{
							this.markers = markers
						})
					},1000)
					....
				}
			},

只要在首次赋值后给一个延时清空并重新赋值就能解决显示变形的问题

相关推荐
然后就去远行吧11 分钟前
小程序API —— 57 拓展 - 增强 scroll-view
小程序
阿里云云原生1 小时前
如何使用通义灵码辅助开发微信小程序
微信小程序·云计算
Fri_2 小时前
微信小程序 request 流式数据处理
微信小程序·小程序
wocwin2 小时前
uniapp微信小程序基于wu-input二次封装TInput组件(支持点击下拉选择、支持整数、电话、小数、身份证、小数点位数控制功能)
微信小程序·uni-app
qq_316837753 小时前
uniapp App页面通过 web-view 调用网页内方法
前端·uni-app
前端小鸡4 小时前
uniapp的v-for不显示或者swiper-item的不显示
uni-app
低代码布道师6 小时前
加油站小程序实战教程08用户注册
低代码·小程序
软件开发156178829237 小时前
B2B2C多用户商城系统:打造新零售电商生态的创新解决方案
小程序·零售
艾路菲尔7 小时前
uniapp小程序登录失效后操作失灵问题
小程序·uni-app
闹小艾7 小时前
生鲜果蔬便利店实体零售门店商城小程序
小程序·零售