allow map to define custom map events

Add handlers and listeners for events explicitly passed as a prop.
This addresses fawmi/vue-google-maps#47
This commit is contained in:
Hans VN
2021-09-21 00:30:20 +02:00
parent 749861bf91
commit 2ee94626f2
2 changed files with 10 additions and 3 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="vue-map-container">
<div class="vue-map-container" :class="$attrs.class">
<div ref="vue-map" class="vue-map"></div>
<div class="vue-map-hidden">
<slot></slot>
@@ -103,7 +103,8 @@ const customMethods = {
export default {
mixins: [mountableMixin],
props: mappedPropsToVueProps(props),
props: mappedPropsToVueProps({...props, ...events.reduce((obj, eventName) => ({...obj, [`on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(/[-_]+(.)?/g, (_, c) => c ? c.toUpperCase() : '')]: Function}), {}) } ),
inheritAttrs: false,
provide() {
this.$mapPromise = new Promise((resolve, reject) => {

View File

@@ -1,6 +1,12 @@
export default (vueInst, googleMapsInst, events) => {
for (let eventName of events) {
if (vueInst.$gmapOptions.autobindAllEvents || vueInst.$attrs[eventName]) {
const propName = `on${eventName.charAt(0).toUpperCase()}${eventName.slice(1)}`.replace(/[-_]+(.)?/g, (_, c) => c ? c.toUpperCase() : '');
if (vueInst.$props[propName] || vueInst.$attrs[propName]) {
googleMapsInst.addListener(eventName, (ev) => {
vueInst.$emit(eventName, ev)
})
} else if (vueInst.$gmapOptions.autobindAllEvents || vueInst.$attrs[eventName]) {
googleMapsInst.addListener(eventName, (ev) => {
vueInst.$emit(eventName, ev)
})