uni-app map组件 安卓机器地图特定情况下跳转到下一个页面再返回地图出现白屏（国外经纬度）

uni-app map组件 安卓机器地图特定情况下跳转到下一个页面再返回地图出现白屏（国外经纬度）

开发环境 版本号 项目创建方式
Mac 12.0.1 HBuilderX

产品分类：uniapp/小程序/微信

示例代码：

<template>  
    <view class="content">  
        <view class="map-title">地图测试</view>  
        <view class="map">  
            <map @tap="mapClick()" :latitude="latitude" :longitude="longitude"></map>  
        </view>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {  
            latitude: 40.75815,  
            longitude: -73.97883,  
        }  
    },  
    methods: {  
        mapClick() {  
            uni.navigateTo({  
                url: '../map-detial/map-detial'  
            })  
        }  
    }  
}  
</script>  

<style>  
map {  
    width: 100%;  
    height: 300rpx;  
}  
</style>

<template>  
    <view class="content">  
        <view class="map-title">地图测试</view>  
        <view class="map">  
            <map @tap="mapClick()" :latitude="latitude" :longitude="longitude"></map>  
        </view>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {  
            latitude: 40.75815,  
            longitude: -73.97883,  
        }  
    },  
    methods: {  
        mapClick() {  
        }  
    }  
}  
</script>  

<style>  
map {  
    width: 100%;  
    height: 300rpx;  
}  
</style>

更多关于uni-app map组件 安卓机器地图特定情况下跳转到下一个页面再返回地图出现白屏（国外经纬度）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app map组件 安卓机器地图特定情况下跳转到下一个页面再返回地图出现白屏（国外经纬度）的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这个问题是安卓平台上使用uni-app的map组件时，在特定国外经纬度下，页面跳转后返回出现白屏的已知问题。主要原因是地图组件在页面隐藏时，安卓原生地图视图可能未正确销毁或恢复，尤其在处理国外坐标时。

解决方案：

  1. 使用v-if控制地图渲染 在页面生命周期中，通过v-if在页面显示时加载地图，离开时销毁：
    <map v-if="showMap" :latitude="latitude" :longitude="longitude"></map>

export default {
  data() {
    return {
      showMap: true
    }
  },
  onShow() {
    this.showMap = true
  },
  onHide() {
    this.showMap = false
  }
}
回到顶部