AlexLavoie42 / Nuxt-Mapbox

Elegant Mapbox integration with Nuxt
81 stars 11 forks source link

Invalid watch source #113

Closed IzakJackson closed 1 month ago

IzakJackson commented 2 months ago

I've recently updated Nuxt and this module to latest and I've started getting this error on pages when the map displays.

[Vue warn]: Invalid watch source:  { lnglat: [ '-1.52097460245078', '53.97654716664479' ],
  markerId: '-1.5209746024507853.97654716664479',
  options: { color: '#ffcd16' } } A watch source can only be a getter/effect function, a ref, a reactive object, or an array of these types.

This is my map:

<MapboxMap
        :key="location.content.longitude + location.content.latitude"
        :map-id="location.content.longitude + location.content.latitude"
        class="w-full h-72 rounded-xl"
        :options="{
          style: 'mapbox://styles/mapbox/dark-v11', // style URL
          center: [location.content.longitude, location.content.latitude], // starting position
          zoom: 14, // starting zoom
          scrollZoom: false,
        }"
      >
        <MapboxNavigationControl
          position="top-right"
          :options="{
            showCompass: false,
          }"
        />
        <MapboxDefaultMarker
          class="text-lft-400"
          :options="{
            color: '#ffcd16',
          }"
          :lnglat="[location.content.longitude, location.content.latitude]"
          :marker-id="location.content.longitude + location.content.latitude"
        >
        </MapboxDefaultMarker>
      </MapboxMap>