uniapp 自动定位当前所在位置/城市

113 阅读1分钟

一进页面,会先询问是否此位置


<script>
onMounted(() => {
	getLocation()
})
//获取位置
const getLocation = () =>{
	uni.showLoading({
		title: 'loading',
		mask: true
	});
	uni.getLocation({
	  type: "gcj02", // 国测局坐标系(高德/腾讯地图通用)
	  success: (res) => {
	    // data.lat = res.latitude;
	    // data.lng = res.longitude;
	    console.log("当前位置经纬度:", res.longitude, res.latitude);
		currentLng.value = res.longitude;
		currentLat.value = res.latitude;
	      // 调用高德逆地理编码 API
	      uni.request({
	        url: "https://restapi.amap.com/v3/geocode/regeo",
	        method: "GET",
	        data: {
	          key: "857f544d44d2a402dd6c00ff53ae4370",
			  location: `${res.longitude},${res.latitude}`,
	        },
	        success: (res) => {
	          console.log(res);
	          if (res.data.regeocode) {
	            const comp = res.data.regeocode.addressComponent;
	            let cityName = comp.city && comp.city.length > 0 ? comp.city : comp.province;
	            cityName = cityName.replace(/市$/, ""); // 去掉末尾的“市”
	            city.value = cityName;
	            console.log("当前城市:", city.value);
				activeCity.value = { cityName: cityName, cityCode: 110100 };
				// getCity () //这个是左上角弹出下拉菜单,获取城市列表的方法
				uni.hideLoading();
	          }
	        },
	      });
	  },
	  fail: (err) => {
	    console.log("获取位置失败:", err);
		city.value = '北京'
		activeCity.value = { cityName: '未定位', cityCode: 110100 };
		uni.hideLoading();
	  },
	});
}
</script>

image.png