问题缘由请参考如下

mapbox图层的点击事件注册一次之后无法取消的问题

https://blog.csdn.net/weixin_44523653/article/details/103665583

mapbox api中描述

所以listener必须为实名的外部函数，而listener中除了event事件对象，没有可传递参数的位置。如何解决？当map.on和map.off在不同的作用域中时，更加麻烦。

mapbox奇葩的是

on：listener中

_self.popup = new mapboxgl.Popup().setLngLat(_coordinates).setHTML(_showInfo).addTo(_self.map);

off：之后

_self.popup&&_self.popup.remove();

这样一一对应才能够关闭气泡。太狭隘了。。。。。。

整个模块多次进行加载和移除，如果on没有对应的执行off，on里面的listenter函数内容就会被执行多次。

结合以上情况，使用AMD开发时，坑还挺多。解决办法如下

使用临时内部函数处理对象点击，可以调用方法里面的模块局部变量，同时用self提升作用域范围指向外部，供off调用，解决。。。。。。。。。。。。。。。。

！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！

查看popup弹出的内容都在div里面，采用最原始的的办法解决，实现所有popup关闭

$(".mapboxgl-popup").remove();

mapbox js map监听on off 匹配问题相关推荐

js 监听安卓事件_百行代码实现js事件监听实现跨页面数据传输
百行代码实现js事件监听实现跨页面数据传输使用场景类似消息队列的使用场景,支持同页面和跨页面通信,发送消息和接收消息技术原理跨页面通信: 基于事件监听,通过监听 storage事件监听回调机制 ...
html 监听input输入框的值,利用原生JS实时监听input框输入值
利用原生JS实时监听input框输入值原生JS中可以使用oninput,onpropertychange,onchange oninput,onpropertychange,onchange的用法 ...
Vue.js：监听属性
ylbtech-Vue.js:监听属性 1.返回顶部 1. Vue.js 监听属性本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化: 实例 & ...
js实时监听input输入框值的变化以便即使匹配搜索项
问题说明在含有搜索框的网页中,经常需要及时匹配搜索项,因此需要监听input输入框的变化事件.如果使用 onkeydown.onkeypress.onkeyup 这个几个键盘事件来监测的话,除了监听 ...
less.js插件监听
<script>less.watch();</script> 在不手动刷新/重新加载页面会自动监听less的变化,页面做出相应的变化 . 写在这两行后面就好了 <lin ...
JS如何监听动画结束
场景描述在使用JS控制动画时一般需要在动画结束后执行回调去进行DOM的相关操作,所以需要监听动画结束进行回调.JS提供了以下事件用于监听动画的结束,简单总结学习下. CSS3动画监听事件 trans ...
js如何监听元素事件是否被移除_JavaScript 监听元素是否进入/移出可视区域
JavaScript 监听元素是否进入/移出可视区域常规操作防抖节流 IntersectionObserver 兼容的代码常规操作通常的做法是,监听srcoll事件,根据元素的offset来判 ...
js微信监听返回_微信小程序（2）- 框架结构amp;运行环境
一.小程序框架结构小程序框架分场景获取.逻辑层和视图层场景获取:场景值是用来描述用户进入小程序的路径,可以在小程序的生命周期onLaunch 或 onShow 里获取.也可以通过wx.getLau ...
js如何监听元素事件是否被移除_JS移除事件监听的方法 .removeEventListener( )
JS用addEventListener添加事件监听方法后,可以用removeEventListener来解除监听: element.removeEventListener(event, myFunct ...

mapbox js map监听on off 匹配问题

问题缘由请参考如下

mapbox图层的点击事件注册一次之后无法取消的问题

mapbox js map监听on off 匹配问题相关推荐

最新文章

热门文章