這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助 1.uni.getLocation 獲取當前經維度 先上代碼 let that = this // 獲取用戶是否開啟 授權獲取當前的地理位置、速度的許可權。 uni.getSetting({ success (res) { console. ...
這裡給大家分享我在網上總結出來的一些知識，希望對大家有所幫助
1.uni.getLocation 獲取當前經維度
先上代碼
let that = this
// 獲取用戶是否開啟 授權獲取當前的地理位置、速度的許可權。
uni.getSetting({
success (res) {
console.log(res)
// 如果沒有授權
if (!res.authSetting['scope.userLocation']) {
// 則拉起授權視窗
uni.authorize({
scope: 'scope.userLocation',
success () {
//點擊允許後--就一直會進入成功授權的回調 就可以使用獲取的方法了
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.longitude = res.longitude
that.latitude = res.latitude
let jinweidu = {
longitude: res.longitude,
latitude: res.latitude,
}
uni.setStorageSync('jinweidu', jinweidu);
console.log(res)
console.log('當前位置的經度：' + res.longitude)
console.log('當前位置的緯度：' + res.latitude)
that.getlist()
}, fail (error) {
uni.showToast({
title: '獲取地址失敗，請檢查手機是否打開定位功能，未打開將導致部分功能不可用',
icon:'none'
});
}
})
},
fail (error) {
//點擊了拒絕授權後--就一直會進入失敗回調函數--此時就可以在這裡重新拉起授權視窗
console.log('拒絕授權', error)
uni.showModal({
title: '提示',
content: '若點擊不授權，將無法使用位置功能',
showCancel: false,
// cancelText: '不授權',
// cancelColor: '#999',
confirmText: '授權',
confirmColor: '#f94218',
success (res) {
console.log(res)
if (res.confirm) {
// 選擇彈框內授權
uni.openSetting({
success (res) {
console.log(res.authSetting)
}
})
} else if (res.cancel) {
// 選擇彈框內 不授權
console.log('用戶點擊不授權')
}
}
})
}
})
} else {
// 有許可權則直接獲取
uni.getLocation({
type: 'wgs84',
success: function (res) {
that.longitude = res.longitude
that.latitude = res.latitude
let jinweidu = {
longitude: res.longitude,
latitude: res.latitude,
}
uni.setStorageSync('jinweidu', jinweidu);
console.log(res)
console.log('當前位置的經度1：' + res.longitude)
console.log('當前位置的緯度1：' + res.latitude)
that.getlist()
}, fail (error) {
uni.showToast({
title: '獲取地址失敗，請檢查手機是否打開定位功能，未打開將導致部分功能不可用',
icon:'none'
});
console.log('失敗', error)
}
})
}
}
})
}
將此方法放到onLoad生命周期內，第一次進入頁面會出現授權彈窗（如下圖）
點擊允許就可以獲取到經緯度了
如果拒絕授權位置信息的話就會出現彈窗進行提醒，提醒內容可以自己更改。
這個時候點擊彈窗的授權會進入設置頁面，允許位置信息再返回就可以獲取到經緯度了
特別註意：
uni.openSetting調起客戶端小程式設置界面，返回用戶設置的操作結果，此api只能在小程式中使用
uni.authorize查看是否已授權api只能在微信、百度、位元組、飛書、快手、QQ小程式中使用。
且需要在微信平臺開通，併在配置文件里設置
"usingComponents": true,
"permission": {
"scope.userLocation": {
"desc": "你的位置信息將用於和門店的距離長度"
}
},
"requiredPrivateInfos": [
"getLocation",
"chooseLocation"
]
2.uni.chooseLocation 調起微信小程式 獲取詳細地址
先看代碼
getMapLocation(){
uni.chooseLocation({
success:(res)=> {
console.log(res);
// this.getRegionFn(res);
},
fail:()=>{
// 如果用uni.chooseLocation沒有獲取到地理位置，則需要獲取當前的授權信息，判斷是否有地理授權信息
uni.getSetting({
success: (res) => {
console.log(res);
var status = res.authSetting;
if(!status['scope.userLocation']){
// 如果授權信息中沒有地理位置的授權，則需要彈窗提示用戶需要授權地理信息
uni.showModal({
title:"是否授權當前位置",
content:"需要獲取您的地理位置，請確認授權，否則地圖功能將無法使用",
success:(tip)=>{
if(tip.confirm){
// 如果用戶同意授權地理信息，則打開授權設置頁面，判斷用戶的操作
uni.openSetting({
success:(data)=>{
// 如果用戶授權了地理信息在，則提示授權成功
if(data.authSetting['scope.userLocation']===true){
uni.showToast({
title:"授權成功",
icon:"success",
duration:1000
})
// 授權成功後，然後再次chooseLocation獲取信息
uni.chooseLocation({
success: (res) => {
console.log("詳細地址",res);
// this.getRegionFn(res);
}
})
}else{
uni.showToast({
title:"授權失敗",
icon:"none",
duration:1000
})
}
}
})
}
}
})
}
},
fail: (res) => {
uni.showToast({
title:"調用授權視窗失敗",
icon:"none",
duration:1000
})
}
})
}
});
},
授權成功後，就可以進入到uniapp自帶的選擇地點的頁面了，可以直接選取/拖動地圖選取/搜索地點選取等多種方式實現地點的選擇，頁面真的是很好看啊。完全長在了我的審美點上。哈哈。
唯一的缺點就是，這個預設使用的騰訊地圖，但是騰訊地圖檢索不是很精確，不如高德。
註意：使用uni.chooseLocation時，地圖載入但附近地址列表不載入問題
與應用的sha1一致
3.uni.openLocation 調起微信小程式 打開詳細地址
先上代碼
//查看內置地圖 (導航) 註意：經緯度必須轉換為number類型，不然就...哈哈哈
goMap(item){
// console.log(item)
uni.openLocation({
latitude: Number(item.take.mer_take_location[0]),
longitude: Number(item.take.mer_take_location[1]),
name: item.take.mer_take_address,
success() {
console.log('success');
}
});
}
使用後效果如下
本文部分轉載於:
https://blog.csdn.net/lovewangyage/article/details/127660148
如果對您有所幫助，歡迎您點個關註，我會定時更新技術文檔，大家一起討論學習，一起進步。
