Markers rendering in v-for update error?

[uwaovo]

Environment: OS: MacOSX 13.4 Node: v18.16.0 Nuxt: 3.5.3 Nuxt-Mapbox: 1.3.7

Screenshot:

Reproduce: When I make a markers template

<template>
  <mapbox-default-marker
    v-for="marker, index in markers"
    :key="`marker ${index + 1}`"
    :marker-id="`marker ${index + 1}`"
    :lnglat="marker.lnglat"
    :options="{
      color: '#ff0000',
    }"
  />
</template>

<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { useGlobalStore } from '~/stores/global';

const store = useGlobalStore()
const { markers } = $(storeToRefs(store))

// const markers = $ref<Marker[]>([
//   {
//     lnglat: [113.931, 22.539]
//   },
//   {
//     lnglat: [113.931, 22.538]
//   }
// ])

// onMounted(() => {
//   store.markers.push({
//     lnglat: [113.930, 22.539]
//   })
// })
</script>

This template was fine at first, two markers appeared successfully. When I went to update the markers in the store elsewhere, I encountered the error in the screenshot. As you can see, the latitude and longitude have been passed correctly to the component. However, when I tried to push a new marker in onMounted, it worked fine again. Any suggestions?

[AlexLavoie42]

Could you please reproduce the issue in the playground? Would help me a lot in finding the issue.

[AlexLavoie42]

I attempted a fix with 1.3.8-dev.0, can you try using that version and let me know if you still have the same error?

[AlexLavoie42]

Fixed in #36