個人項(xiàng)目地址：?SubTopH前端開發(fā)個人站

（自己開發(fā)的前端功能和UI組件，一些有趣的小功能，感興趣的伙伴可以訪問，歡迎提出更好的想法，私信溝通，網(wǎng)站屬于靜態(tài)頁面）

SubTopH前端開發(fā)個人站https://subtop.gitee.io/subtoph.github.io/#/home

以上 ?? 是個人前端項(xiàng)目，歡迎提出您的建議??

以下uniapp&&微信小程序中打開騰訊地圖獲取用戶位置信息

實(shí)現(xiàn)的效果

第一步：首先登錄微信公眾平臺?, 需要用到AppID

第二步： 注冊登錄騰訊位置服務(wù)

注冊需要手機(jī)號和郵箱確認(rèn)，然后創(chuàng)建應(yīng)用

創(chuàng)建后點(diǎn)擊添加key

添加后會生成key，后面會用到這個key

第三步：?登錄微信公眾平臺，進(jìn)入開發(fā)管理- -> 開發(fā)設(shè)置 添加?服務(wù)器域名

?第四步：在 manifest.json 文件 Web配置中，定位和地圖勾選騰訊地圖，將自己的騰訊地圖的 Key 粘貼至此。

?代碼中

?第五步：以上配置全部完成下面是開發(fā)代碼

點(diǎn)擊按鈕

<view class="positioning-logo" @click="getLocation">
   <image
      src="/static/image/positioning.png"
       class="positioning-img"
   />
   <text>定位</text>
</view>

?js代碼

const getLocation = () => {
      uni.getSystemInfo({
        success(res) {
          let locationEnabled = res.locationEnabled; //判斷手機(jī)定位服務(wù)是否開啟
          let locationAuthorized = res.locationAuthorized; //判斷定位服務(wù)是否允許微信授權(quán)
          if (locationEnabled == false || locationAuthorized == false) {
            //手機(jī)定位服務(wù)（GPS）未授權(quán)
            uni.showModal({
              title: "授權(quán)",
              content: "獲取授權(quán)失敗，是否前往授權(quán)？",
              success: function (result) {
                if (result.confirm) {
                  uni.openAppAuthorizeSetting();
                }
              },
              fail: function () {
                uni.showToast({
                  title: "請前往設(shè)置中授權(quán)位置信息",
                  icon: "none",
                });
              },
            });
          } else {
            uni.chooseLocation({
              success: function (response) {
                console.log("位置信息:", response);
                // response對象信息
                // address: "北京市豐臺區(qū)文體路3號"
                // errMsg: "chooseLocation:ok"
                // latitude: 39.85856
                // longitude: 116.28616
                // name: "北大地北京市豐臺區(qū)人民政府(文體路)"
                if (response.address) {
                  // 獲取詳細(xì)信息后，分割出省市縣
                  const extractAddress = getArea(response.address);
                  // [省，市，縣，詳細(xì)地址]
                  userInfo.areaProvince = extractAddress.shift();  
                  userInfo.areaCity = extractAddress.shift();
                  userInfo.areaRegion = extractAddress.shift();
                  userInfo.areaInfo = extractAddress.join(""); //詳細(xì)地址
                }
        
              },
            });
          }
        },
      });
    };

獲取位置信息后? ?北京市北京市豐臺區(qū)xxxxxxxxxxxxxxx

我們需要處理? 獲取? [省,市,縣,詳細(xì)地址]

/**
 * 處理 北京市北京市豐臺區(qū)北大地四里甲12號樓(近豐臺文化館,地鐵9號線豐臺東大街站)
 * 
 * ['北京市','北京市','豐臺區(qū)','北大地四里甲12號樓(近豐臺文化館,地鐵9號線豐臺東大街站)]
 */
export const getArea = (str) => {
    const reg = /.+?(省|市|自治區(qū)|自治州|縣|區(qū))/g;
    const extract = str.match(reg);
    extract.push(str.replace(reg, ''))
    return extract
}

分別賦值省市縣詳細(xì)地址?文章來源地址http://www.zghlxwxcb.cn/news/detail-637121.html

const extractAddress = getArea(response.address);   //獲取分割好的地區(qū)數(shù)組
userInfo.areaProvince = extractAddress.shift();  //賦值省級
userInfo.areaCity = extractAddress.shift();    //賦值市級
userInfo.areaRegion = extractAddress.shift();  //賦值區(qū)級
userInfo.areaInfo = extractAddress.join(""); //賦值詳細(xì)地址

到了這里，關(guān)于uniapp&&微信小程序中打開騰訊地圖獲取用戶位置信息的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！