vue-baidu-map icon indicating copy to clipboard operation
vue-baidu-map copied to clipboard

手机端,bm-geolocation定位或者手动调用geolocation.getCurrentPosition页面高度增加20px左右高度,出现滚动条

Open HanJinLiang opened this issue 4 years ago • 2 comments

[BUG 反馈] 手机端,bm-geolocation定位或者手动调用geolocation.getCurrentPosition页面高度增加20px左右高度,出现滚动条

浏览器版本号

chrome 84.0.4147.89

Vue 版本号

2.6.11

组件库版本号

0.21.22

现象描述

bm-geolocation定位或者手动调用geolocation.getCurrentPosition页面高度增加20px左右高度,出现滚动条

完整异常信息

在线示例 / 仓库 URL

复现用例

<template>
    <div class="div-root">
        <baidu-map class="bm-view" :center="center" :zoom="zoom" @ready="handler">
            <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT" :showAddressBar="true" :autoLocation="true"></bm-geolocation>
        </baidu-map>
    </div>

</template>

<script>
    export default {
        data () {
            return {
                center: {
                    lng:"121.315046",
                    lat:"31.344405"
                },
                zoom: 13
            }
        },
        methods: {
            handler ({BMap, map}) {
                console.log(BMap, map)
                this.center.lng = 121.315046
                this.center.lat = 31.344405
                this.zoom = 15
            }
        }
    }
</script>

<style scoped>
.div-root{
    height: 100%;
}
.bm-view {
    width: 100%;
    height: 300px;
}
</style>

预期输出

页面高度不变化

实际输出

上面是写的一个demo,点击定位按钮 ,定位完成后,页面高度增高20px左右,出现滚动条。
但是在web模式下是没有问题,请问下是怎么回事?

HanJinLiang avatar Jul 30 '20 08:07 HanJinLiang

是因为底部追加了一个 iframe <iframe height="0" width="0" src="https://api.map.baidu.com/res/staticPages/location.html?timeout=5000&amp;maximumAge=600000&amp;type=2" style="border-width: 0px;"></iframe> 我也预见这个问题了

13191868165 avatar Aug 22 '20 11:08 13191868165

是的 我目前就是把这个iframe不显示

HanJinLiang avatar Aug 26 '20 07:08 HanJinLiang