vue-baidu-map 进入页面自动定位的解决方案(推荐)
发布时间：2020-12-17 02:18:58 所属栏目：百科 来源：网络整理
导读：写在前面：我只是一个前端小白，文章中的提到可能会有不足之处，仅提供一个参考。若有不完善的地方，欢迎各位大佬指出！，希望对你有帮助！ 好了，入正题。其实之前也被这问题困扰过，在网上也查了一番，没找到解决方法。直到今天，在冒昧地向大佬提了一个 i
|
写在前面：我只是一个前端小白，文章中的提到可能会有不足之处，仅提供一个参考。若有不完善的地方，欢迎各位大佬指出！，希望对你有帮助！ 好了，入正题。其实之前也被这问题困扰过，在网上也查了一番，没找到解决方法。直到今天，在冒昧地向大佬提了一个 issue，才点醒了我。其实是因为太过急功近利了，没有认真阅读 vue-baidu-map 提供，也有可能是看过然后忘记了！ 首先要明确一点（）：由于百度地图 JS API 只有 JSONP 一种加载方式，因此 BaiduMap 组件及其所有子组件的渲染只能是异步的。因此，请使用在组件的 ready 事件来执行地图 API 加载完毕后才能执行的代码，不要试图在 vue 自身的生命周期中调用 BMap 类，更不要在这些时机修改 model 层。 错误用法我试过，以上这种方法好像是可行，效果可以出来，但我们最好采用作者提供的正确方法！ 正确用法推荐这种方法！那下面解决进入页面自动定位的方法也是在这里。 下面是我的写法，仅供参考，有不足请指出，我只是一个小白，哈哈！ Template： JS实现：
export default {
data () {
return {
// 省略一部分
autoLocationPoint: {lng: 0,lat: 0},initLocation: false,}
},methods: {
handler ({BMap,map}) {
let _this = this; // 设置一个临时变量指向vue实例，因为在百度地图回调里使用this，指向的不是vue实例；
var geolocation = new BMap.Geolocation();
geolocation.getCurrentPosition(function(r){
console.log(r);
_this.center = {lng: r.longitude,lat: r.latitude}; // 设置center属性值
_this.autoLocationPoint = {lng: r.longitude,lat: r.latitude}; // 自定义覆盖物
_this.initLocation = true;
console.log('center:',_this.center) // 如果这里直接使用this是不行的
},{enableHighAccuracy: true})
} 如果是直接的朋友请注意，要有选择的复制，因为我没有把全部代码贴出了，直接复制到你的项目是会出问题的！不过这代码比较简单，稍微就能看懂，哈哈！ 以上所述是小编给大家介绍的vue-baidu-map 进入页面自动定位的解决方案。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |