Uniapp中小程序调用腾讯地图(获取定位地址)

1、先配置权限:

这是上图的代码:

"permission": {

"scope.userLocation": {

"desc": "你的位置信息将用于小程序位置接口的效果展示"

}

}

第二步:写代码:

javascript 复制代码
      
//====下面是uniapp的模版代码 主要就是 chooseLocation  方法

<!-- 上门服务地址 -->
      <view class="form-item">
        <text class="label">
          <text class="required">*</text>上门服务地址
        </text>
        <view class="input-wrapper" @click="chooseLocation">
          <input class="input" placeholder="请定位" v-model="form.serviceAddr" />
        </view>
        <view v-if="showServiceAddrError" class="error-tip">*请填写上门服务地址</view>
      </view>

//====下面是script代码



    //微信定位
    chooseLocation() {
      uni.authorize({
        scope: 'scope.userLocation',
        success: () => {
          uni.chooseLocation({
            success: (res) => {
              this.form.serviceAddr = res.address || res.name;
            },
            fail: () => {
              uni.showToast({ title: '定位失败', icon: 'none' });
            },
          });
        },
        fail: () => {
          uni.showModal({
            title: '授权提示',
            content: '需要您授权地理位置权限',
            success: (modalRes) => {
              if (modalRes.confirm) {
                uni.openSetting();
              }
            },
          });
        },
      });
    }
  },

第三步:用不用去配置其他,就这样行就好了,可以调出来腾讯地图。

相关推荐
代码游侠1 分钟前
学习笔记——ARM Cortex-A 裸机开发实战指南
linux·运维·开发语言·前端·arm开发·笔记
Jay Chou why did3 分钟前
uboot—1.概述
linux
IT 行者4 分钟前
Claude之父AI编程技巧十一:MCP服务器集成——连接AI与现实世界的桥梁
服务器·人工智能·ai编程
纵有疾風起5 分钟前
【Linux 系统开发】基础开发工具详解:软件包管理器、编辑器。编译器开发实战
linux·服务器·开发语言·经验分享·bash·shell
汪汪大队u7 分钟前
各类 NAT 的差异
运维·服务器
北邮刘老师10 分钟前
从SEO到ADO:智能体时代的流量密码
服务器·网络·数据库·人工智能·大模型·智能体·智能体互联网
乌萨奇也要立志学C++23 分钟前
【Linux】信号量 信号量详解与应用和基于环形队列实现单 / 多生产消费模型
linux·c++
DN金猿25 分钟前
ubuntu在apt安装时出现的弹窗详解
linux·运维·ubuntu
山上三树35 分钟前
Linux C多线程的**所有底层核心原理**
linux
大地的一角42 分钟前
(Linux)进程间通信
linux·运维·服务器