Small question about reactive markers

[NathanAP]

Hi,

I was creating some tests in my project, trying to make markers reactive. I reach a point I made this (it is working):

<script setup>
const mapKey = "YOUR_MAP_KEY"
let mapCenter = { lat: -14.8850354, lng: -50.0596995 }
const markerPosition = ref({ position: mapCenter })

function changeMarkerPosition(e) {
    markerPosition.value = {
        position: { lat: e.latLng.lat(), lng: e.latLng.lng() },
    }
}
</script>

<template>
    <GoogleMap
        :api-key="mapKey"
        :center="mapCenter"
        :style="mapStyle"
        :zoom="5"
        @click="changeMarkerPosition"
    >
        <Marker :options="markerPosition" />
    </GoogleMap>
</template>

in issue #56 it was said that we could make markerPosition get the entire value again to make it reactive. Is this the right behaviour or it will be changed in the future? Maybe its a good idea to put this in the docs, since most of the components could be changed just by doing markerPosition.position.lat = e.latLng.lat() (which doesn't make the marker reactive).

[HusamElbashir]

That's correct @NathanAP we currently don't deep watch options so you'll have to re-assign the value of the root position property for the marker to react. It's definitely something we can improve though.

[NathanAP]

All right, no problems with it! I'm asking just because in Vue3 if you change a reactive object it changes in the template as well, so when I was making tests, it seemed that my code was wrong.

Thanks for your dedication with this package, I'm sure I'll make it even better.