网站开发排期表模板,wordpress 表白主题,响水企业做网站多少钱,好的做蛋糕网站1.uniapp自带uni.getLocation
uni.getLocation(options) getlocation | uni-app官网
实现思路#xff1a;uni.getLocation获取经纬度后调用接口获取城市名
优点#xff1a;方便快捷#xff0c;直接调用
缺点#xff1a;关闭定位后延时很久#xff0c;无法控制定位延迟…1.uniapp自带uni.getLocation
uni.getLocation(options) getlocation | uni-app官网
实现思路uni.getLocation获取经纬度后调用接口获取城市名
优点方便快捷直接调用
缺点关闭定位后延时很久无法控制定位延迟时间流程卡顿。获取手机定位权限方法不支持h5
2.百度map
创建BMap.js
export default {init() {const BMap_URL https://api.map.baidu.com/api?ak${ baiduAk }s1callbackonBMapCallbackreturn new Promise((reslove, reject) {if(typeof BMap ! undefined) {reslove(BMap)}window.onBMapCallback function() {reslove(BMap)}let scriptNode document.createElement(script)scriptNode.setAttribute(type, text/javascript)scriptNode.setAttribute(src, BMap_URL)document.body,appendChild(scriptNode)})}
}
引入使用
import map from /pages/plugins/BMap.js
map.init().then(BMap {const locationCity new BMap.Geolocation()locationCity.getCurrentPosition((options) {let city options.address.cityif(!city) {city 北京}// store.commit(getlocation, city)Vue.prototype.$cityName city// 挂载页面}).catch((e) {})
})
优点比较稳健功能支持群面
缺点dom拼接百度map降低性能初始化时慢3秒
3.浏览器内置对象navigator.geolocation
if(navigator.geolocation) {let options {enableHighAccuracy: true, // 默认false, 为true时使用精准定位timeout: 5000, // 获取位置最长等待时间默认不限时间maximumAge: 21600000, // 重复获取位置时多长时间再次获取定位 这里设置成6h 21600000}navigator.geolocation.getCurrentPosition(sucCallback, errorCallback, options)
}
function sucCallback(position) {var cords position.coordsgetAddressInfo({ }).then(res {let city res.data.cityif(!city) {city 北京}// store.commit(getlocation, city)Vue.prototype.$cityName city// 挂载页面})
}
function errorCallback(error) {var err error.codeswitch(err) {case 0: alert(未识别到位置信息)break;case 1: alert(您拒绝了定位权限)break;case 2: alert(地理位置获取失败)break;case 3:alert(定位超市)break;default://}// store.commit(getlocation, 北京)Vue.prototype.$cityName 北京// 挂载页面
}
优点性能好加载快
缺点仅支持https协议链接http协议下无法正常定位
