1. 申请key
2. 下载sdk到本地
3. 添加sdk到工程
把下载下来的sdk放到mpvue工程的static目录下,保证不被webpack编译到。要是放在pages目录中会报错的。
4. 引入js文件
在你需要获取位置服务的.vue文件中引入这个js文件,像我的路径是这样:
// index.vue
import QQMapWX from '../../../static/js/qqmap-wx-jssdk.js'
复制代码
5. 调用
data () {
return {
qqMapSdk: null
}
},
created () {
// let app = getApp()
// 实例化API核心类
this.qqMapSdk = new QQMapWX({
key: '你在官网申请到的key'
})
this.getCurLocation()
},
methods: {
/**
* 获取当前位置
*/
getCurLocation() {
let self = this
wx.getLocation({
type: 'gcj02 ',
success: function (res) {
// 调用接口
self.qqMapSdk.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success: function (res) {}
})
}
复制代码
6. 坑
出现这个错误是我根据别的博客文章,去修改了qqmap-wx-jssdk.js
里面:
// module.exports = QQMapWX; // 原本长这样
export default QQMapWX; // 我根据别的文章改成这样
复制代码
结果就报错了。后来我就放弃修改,也就是没有修改qqmap-wx-jssdk.js
,原原本本地用module.exports = QQMapWX;
然后就没报错了,能正常使用。