本文主要是介绍VUE做百度地图信息弹窗,并在信息弹窗内容获取html的点击事件,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
公司项目是使用的vue做的,里面要做百度地图,刚刚开始使用的离线地图,由于很多限制原因造成离线地图效果总是不尽人意,最大的原因就是想要使用百度的API(例如:点击弹出信息窗口,轨迹,路书),这些都需要离线的JS文件支持,一直没有找到,找到的也是错的,最终决定换!直接换在线的!
(PS:主要就是讲一下怎么在VUE中获取到地图信息弹窗中的内容点击事件,如果有在做地图时的其他疑问也可以问我,咱们交流一下兴许你就思路大开了~)
上代码:
我是通过百度地图API中富文本窗口自己改的,调用了InfoBox这个方法,填充一个HTML进去即可
contents = ["<div class='infoBoxContent'><div><label>设备名称:</label><span οnclick='lookDetail()'>背包箱</span></div>" + "<div><label>设备编号:</label><span>" + smartBox.uniqueCode + "</span></div>" + "<div><label>设备状态:</label><span>离线</span></div></div>"];
定义个点击事件onclick='lookDetail()'
,在vue中想要触发这个点击事件要挂到window上,所以在created中写上:
created(){window.lookDetail = this.lookDetail;
},
这里调用测试:
lookDetail(val){console.log("进入测试...")}
以上在测试处写自己的业务即可
这篇关于VUE做百度地图信息弹窗,并在信息弹窗内容获取html的点击事件的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!