vue 使用高德地图vue-amap组件过程解析

2020-06-14 06:19:22易采站长站整理

options = options || {};
if(AMap){
AMap.plugin(['AMap.Geocoder'], () => {
const geocoder = new AMap.Geocoder({
radius: options.radius || 1000,
extensions: options.extensions || "all"
})
var lnglatXY = options.lnglatXY || [114.397169, 30.50576]; //已知点坐标
geocoder.getAddress(lnglatXY, function(status, result) {
if (status === 'complete' && result.info === 'OK') {
options.success && options.success(result);
}else{
options.error && options.error(status,result);
}
});
});

}

}
},
"watch":{
list:function(){
this.currIndex = 0;
}
}

};

/*
me.$Geocoder({
lnglatXY:[center.lng, center.lat],
success:function(res){
console.log(res);
}
});
*
* */
</script>

bus.js


let instance = null;
class EventBus {
constructor() {
if (!instance) {
this.events = {};
instance = this;
}
return instance;
}
$emit(event, message) {
if (!this.events[event])
return;
const callbacks = this.events[event];
for (let i = 0, l = callbacks.length; i < l; i++) {
const callback = callbacks[i];

callback.call(this, message);
}
}
$on(event, callback) {
if (!this.events[event])
this.events[event] = [];

this.events[event].push(callback);
}
}
export default new EventBus();

效果图

https://elemefe.github.io/vue-amap/#/zh-cn/introduction/install