Reactive Marker State

[stevegiorgi]

I don't know if this is necessarily an issue with the v-mapbox reactive state but I'm not certain either – I'm pulling marker locations from an API via a bounding box so that I only pull locations that are within the viewport. I refresh this upon manipulating the map with new bounding box coordinates each time. It pulls in all of the viewable markers beautifully. I then added a check to do the reverse; if the marker is no longer within the viewable area I remove it; each action is a getter and commit to vuex with the ID and coordinates of the marker. The problem is that when a marker is removed, and the viewport is repositioned back over the area where the marker should exist, it doesn't pull in or refresh the marker state; it no longer exists on the map until I've refreshed the page. A fresh pull of marker positions is being pulled on every update, which includes coordinates that no longer appear on the map.

I'm thinking this has to do with either the reactivity of the markers or something is happening within veux that I don't understand – removing a marker is a "commit" so it seems as though this is permanent until the entire state has been refreshed, but I'm pulling in a fresh state of markers on each update, so I'm not so sure this would matter. Any ideas on this would be greatly appreciated.

[vinayakkulkarni]

Can you please create a repro link? codesandbox or stackblitz would work