uni-app 获取地图中心点坐标调用this.mapContext.getCenterLocation没有反应

uni-app 获取地图中心点坐标调用this.mapContext.getCenterLocation没有反应

开发环境 版本号 项目创建方式
Mac 11 HBuilderX 
产品分类：uniapp/App

PC开发环境操作系统：Mac

PC开发环境操作系统版本号：11

HBuilderX类型：正式

HBuilderX版本号：3.2.3

手机系统：iOS

手机系统版本号：IOS 14

手机厂商：苹果

手机机型：xsmax

页面类型：nvue

打包方式：云端

示例代码：
```javascript  
this.mapContext.getCenterLocation({  
            success: (res) => {  
                console.log("getCenterLocation");  
                console.log(res);  
            }  
        })

操作步骤：

this.mapContext.getCenterLocation({  
            success: (res) => {  
                console.log("getCenterLocation");  
                console.log(res);  
            }  
        })

预期结果：

nvue页面获取地图中心点坐标

实际结果：

调用this.mapContext.getCenterLocation没有反应

bug描述：

nvue页面使用getCenterLocation获取中心点坐标没反应

更多关于uni-app 获取地图中心点坐标调用this.mapContext.getCenterLocation没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html

14 回复

用下面的代码验证下
<template>
<view>
<map id="map1" class="map1" :latitude="latitude" :longitude="longitude"></map>
<button @click=“getCenterLocation”>getCenterLocation</button>
</view>
</template>

<script> export default { data() { return { latitude: 39.925539, longitude: 116.279037 } }, onReady() { this.mapContext = uni.createMapContext("map1", this); }, methods: { getCenterLocation() { this.mapContext.getCenterLocation({ success: (res) => { console.log("getCenterLocation"); console.log(res); } }) } } } </script> <style> .map1 { width: 750rpx; height: 400px; } </style>

更多关于uni-app 获取地图中心点坐标调用this.mapContext.getCenterLocation没有反应的实战教程也可以访问 https://www.itying.com/category-93-b0.html


我刚才试了，在nvue中没有效果，点击没有反应

回复 小明学长: 用的什么基座？新建个项目，代码贴进去试试

回复 DCloud_uniad_HDX: 测试用例我用的标准基座不行，下面的测试代码帮忙看下哪里的问题

回复 小明学长: 确定是新建空项目 粘贴到 index 并修改扩展名改为nvue 吗

回复 DCloud_uniad_HDX: 不是，我是建的空项目然后在index中引入的map.nvue这样子

回复 DCloud_uniad_HDX: 我刚才又试了一下，直接用nvue的话可以获取，我是在vue中通过subNVues引入的，这样不行

回复 小明学长: 直接用怎么用啊，我也是subnvues引入的，一堆问题，比如用点聚合不显示marker，initMarkerCluster都不执行回调

测试代码

“pages”: [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
{
“path”: “pages/index/index”,
“style”: {
“navigationBarTitleText”: “uni-app”,
“app-plus”: {
“subNVues”: [{
“id”: “map”, // 唯一标识
“path”: “pages/index/map”, // 页面路径
“style”: {
“position”: “absolute”,
“dock”: “top”,
“top”: “10%”,
“width”: “100%”,
“background”: “transparent”
}
}]
}
}
}
],

雀儿八十,在单独的nvue页面可以的,如果用subNVues形式引入进来就不行了

如果只能subnvues引入有解决办法吗

我的success 和 fail 都不执行 求救


在 nvue 页面中使用 mapContext.getCenterLocation 无响应，通常与以下原因有关：

  1. 时机问题：mapContext 必须在 onReady 回调中获取，确保地图渲染完成。

    onReady() {
    this.mapContext = uni.createMapContext('map', this);
}

  2. 异步问题：getCenterLocation 需要在 onReady 之后调用，建议添加延时或确保地图完全加载。

    setTimeout(() => {
    this.mapContext.getCenterLocation({
        success: (res) => {
            console.log(res);
        }
    });
}, 500);
回到顶部