1.进入腾讯地图开放平台,点击开放平台中的微信小程序JavaScript SDK,按照步骤进行操作
注意:在key管理中要填上自己申请的微信小程序ID
一直进行到第四步
然后在要使用定位的页面中引入
注意:刚才下载的文件一定要保证路径的正确
var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
var qqmapsdk;
比如
然后使用
methods:{
location(){
qqmapsdk = new QQMapWX({
key: 'B4VBZ-R6DWS-WVKOX-6KXBL-GDA2Q-ZWBTP'
})
qqmapsdk.reverseGeocoder({
success:res=>{
console.log(res)
this.address=res.result.ad_info.city
},
fail:err=>{
console.log('用户拒绝定位')
this.address="北京市"
}
})
}
},
created() {
this.location()()
}
记得在微信小程序的app.json中添加一个permission
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
},
如果要封装这个定位
1.创建封装定位的JavaScript文件
//定位封装
var QQMapWX = require('./qqmap-wx-jssdk.js');
var qqmapsdk;
function location(){
return new Promise((resolve,reject)=>{
qqmapsdk = new QQMapWX({
key: 'B4VBZ-R6DWS-WVKOX-6KXBL-GDA2Q-ZWBTP'
})
qqmapsdk.reverseGeocoder({
success:res=>{
resolve(res)
},
fail:err=>{
reject(err)
}
})
})
}
export {location}
2.在组件中使用这个封装的定位文件