小程序如何定位所在城市及发起周边搜索
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（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。