项目场景:
vue el-scrollbar +百度地图
例如:vue 使用 vue-baidu-map 地图 el-scrollbar 中嵌套百度地图出现缩放偏移量
原因分析:
分析:因为baidu地图到el-dialog上 但是滚动条滚动 里面的内容也是间接的向上transfrom 偏移 造成百度地图缩放偏移
解决方案:
提示:监听el-scrollbar 的滚动量 给map的div 的style 进行transform 修改偏移量
mounted() {
this.$nextTick(() => {
this.$refs.scrollbar1.wrap.addEventListener("scroll", this.handleScroll);
})
},
handleScroll() {
let top = this.$refs.scrollbar1.wrap.scrollTop
console.log(tope)
let myditu = document.getElementById('myditu')
myditu.style.transform = 'translateY(' + top + 'px' + ')';
myditu.style.position = 'absolute';
myditu.style.top = '-' + top + 'px'
},