新聞動(dòng)態(tài)

位置:首頁(yè) 新聞動(dòng)態(tài) 常見(jiàn)問(wèn)題

uni-app微信小程序地圖獲取當(dāng)前位置完整案例

新聞動(dòng)態(tài)
2022年02月22日 閱讀:2941次

首先需要在配置文件中進(jìn)行配置授權(quán)提示 點(diǎn)擊源碼視圖 添加下面代碼

/* 小程序特有相關(guān) */
    "mp-weixin" : {
        "appid" : "wxda33332553aa5",
        "setting" : {
            "urlCheck" : false
        },
	"permission" : {
	    "scope.userLocation" : {
		"desc" : "您的位置將用于綁定您的區(qū)域"
	    }
	},
        "usingComponents" : true
    },

主要添加

"permission" : {
	    "scope.userLocation" : {
		"desc" : "您的位置將用于綁定您的區(qū)域"
	    }
},

如果獲取當(dāng)前位置需要多次使用可以封裝在公共js文件中

//網(wǎng)絡(luò)請(qǐng)求
	map: function() {
		//對(duì)參數(shù)進(jìn)行處理
		return new Promise((reslove, reject) => {
			uni.chooseLocation({
					success:(res)=> {
					reslove(res);
					},
					fail:()=>{
						uni.getSetting({
							success: (res) => {
								var status = res.authSetting;
								if(!status['scope.userLocation']){
									uni.showModal({
										title:"是否授權(quán)當(dāng)前位置",
										content:"需要獲取您的地理位置,請(qǐng)確認(rèn)授權(quán),否則地圖功能將無(wú)法使用",
										success:(tip)=>{
											if(tip.confirm){
												uni.openSetting({
													success:(data)=>{
													
														if(data.authSetting['scope.userLocation']===true){
															uni.showToast({
																title:"授權(quán)成功",
																icon:"success",
																duration:1000
															})
															uni.chooseLocation({
																success: (res) => {
															reslove(res);
																	// this.getRegionFn(res);
																}
															})
														}else{
															uni.showToast({
																title:"授權(quán)失敗",
																icon:"none",
																duration:1000
															})
														}
													}
												})
											}
										}
									})
								}
							},
							fail: (res) => {
								uni.showToast({
									title:"調(diào)用授權(quán)窗口失敗",
									icon:"none",
									duration:1000
								})
							}
						})
					}
				});
		});
	},
	

頁(yè)面調(diào)用

<view @click="chooseLocation" class="iconfont icon-daohang"> </view>
//獲取位置
chooseLocation(){
	this.helper.map().then(res => {
		this.homeAddressStreet=res.address
		this.latitude=res.latitude
		this.name=res.name
		this.longitude=res.longitude	
	});
},

上一篇

下一篇

關(guān)鍵詞: uni-app 微信小程序