小程序如何定位所在城市及发起周边搜索
request封装
为小程序get/post的promise封装
rq.js
/* *url{String}请求地址接口 *data{Object}请求参数 *param{Object}request参数 *method{String}指定使用post或者是get方法 */ exportfunctionrequest(url,data={},param={},method='POST'){ returnnewPromise((resolve,reject)=>{ letpostParam={ url, method, data, //timeout //dataType //responseType header:{ 'content-type':'application/json'//默认值 }, success(res){ resolve(res) }, error:function(e){ reject(e) } } postParam=Object.assign(postParam,param) postParam.fail=postParam.error if(postParam.url)wx.request(postParam) }) } module.exports={ get(url,data,param){ returnrequest(url,data={},param={},method='GET') }, post(){ returnrequest.apply(null,arguments) } }
位置服务方法
需要开通小程序的位置服务功能,在小程序控制台
简单的封装了三个位置服务的方法
- 所在地城市
- 地区搜索
- 范围搜索
//request的promise封装 constiKit=request('./rq.js') //key为开通位置服务所获取的查询值 //下面这个key是随便写的 letkey='JKDBZ-XZVLW-IAQR8-OROZ1-XR3G9-UYBD5' /* *搜索地区... *搜索地区的商圈,如搜索kfc广州市 *key{String}搜索内容 *region{String}搜索区域 */ exportfunctionsearchRegion(kw,region){ letopts={ keyword:encodeURI(kw), boundary:region?`region(${encodeURI(region)},0)`:'',//0为限定范围搜搜索,1为开放范围搜素偶 page_size:10,//搜索结果分页最大条数 page_index:1,//指定分页 key } returnnewPromise((resolve,rej)=>{ iKit.get('https://apis.map.qq.com/ws/place/v1/search',opts).then(res=>{ resolve(res.data.data) }) }) } /* *搜索附近的... *以当前位置的经纬度搜索附近商圈,如附近的酒店,快餐等等 *key{String}搜索内容 *params{Object}搜索参数包含三个参数lat纬度,lng经度,distance范围(单位米) */ exportfunctionsearchCircle(kw,params={}){ let{lat,lng,distance}=params if(!lat&&!lng)return if(!distance)distance=1000//搜索范围默认1000米 letopts={ keyword:encodeURI(kw), boundary:`nearby(${lat},${lng},${distance})`, orderby:'_distance',//范围搜索支持排序,由近及远 page_size:20,//搜索结果分页最大条数 page_index:1,//指定分页 key } returnnewPromise((resolve,rej)=>{ iKit.get('https://apis.map.qq.com/ws/place/v1/search',opts).then(res=>{ resolve(res.data.data) }) }) } //所在地的城市,省份等区域信息 /* *所在地的城市,省份等区域信息 *如当前地址所在省份、城市 *lat{Number}纬度 *lng{Number}经度 */ exportfunctionmyCity(lat,lng){ returnnewPromise((resolve,rej)=>{ letopts={ location:`${lat},${lng}`, key } iKit.get(`https://apis.map.qq.com/ws/geocoder/v1/`,opts).then(res=>{ resolve(res.data.result) }) }) }
调用
wx.getLocation({ type:'wgs84', success(location){ locationPosition=location //所在地信息 myCity(location.latitude,location.longitude).then(res=>{ letmyCityInfo=res.ad_info let{city,nation,province,city_code,adcode}=myCityInfo console.log({title:`国家:${nation},省份:${province},城市:${city}`}) }) //附近搜索 searchCircle('快餐',{ lat:location.latitude, lng:location.longitude, distance:500 }).then(res=>{ console.log(res) }) //地区搜索 searchRegion('酒店','广州').then(res=>{ console.log(res) }) } })
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持毛票票。
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。