vue baidu map bmmarker Drag map point position changes

This answer references ChatGPT
If you are using the vue-bidu-map plug-in and have problems with the location of the tag changing when you drag the tag, This may be because the zoom level of the map view affects the location of the markers.

One solution is to add a @zoomend event to the component, which fires when the map zoom level is changed, and then use the getPosition() method on the component to get the position of the tag and set it to the new position of the component data to reflect the new zoom level.

<template>
  <div>
    <baidu-map @zoomend="handleZoomEnd">
      <bm-marker :position="markerPosition" draggable>bm-marker>
    baidu-map>
  div>
template>

<script>
export default {
  data() {
    return {
      markerPosition: { lng: 116.404, lat: 39.915 },
    };
  },
  methods: {
    handleZoomEnd(e) {
      this.markerPosition = this.$refs.marker.getPosition();
    },
  },
};
script>

In the above example, after the component fires the @zoomend event, the handleZoomEnd method calls the component's getPosition() method to get the position of the tag and set it to the new position of the component's data. This will ensure that the tag keeps its position in the correct location even after the map zoom level changes.