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 小时前
记录自己第一次将React 编写的前端部署到服务器,实现外网访问
服务器·前端·react.js
.小小陈.2 小时前
Linux高频基础实用指南:从文件操作到日志
linux·运维·服务器
Java.熵减码农8 小时前
解决Linux修改环境变量后导致登录循环进不去系统的问题
linux·运维·服务器
明天好,会的8 小时前
分形生成实验(五):人机协同破局--30万token揭示Actix-web状态管理的微妙边界
运维·服务器·前端
天骄t8 小时前
嵌入式系统与51单片机核心原理
linux·单片机·51单片机
阿部多瑞 ABU9 小时前
`chenmo` —— 可编程元叙事引擎 V2.3+
linux·人工智能·python·ai写作
徐同保10 小时前
nginx转发,指向一个可以正常访问的网站
linux·服务器·nginx
HIT_Weston10 小时前
95、【Ubuntu】【Hugo】搭建私人博客:_default&partials
linux·运维·ubuntu
实心儿儿10 小时前
Linux —— 基础开发工具5
linux·运维·算法
oMcLin10 小时前
如何在SUSE Linux Enterprise Server 15 SP4上通过配置并优化ZFS存储池,提升文件存储与数据备份的效率?
java·linux·运维