Markers clone and dont show title when creating

[tallesdantas]

hi guys i have this map in my layoyt
`
<button @click="getRoute()">rota

	<gmap-marker
      :key="index"
      v-for="(m, index) in markers"
      :position="m.position"
      :clickable="true"
      :draggable="true"
      @click="center=m.position"
    ></gmap-marker>

	</gmap-map>`

and in my vue component i have:

`data () {
return {
directionsService:{},
directionsDisplay:{},

      infoContent: 'x',
      infoWindowPos: {
        lat: 0,
        lng: 0
      },
      infoWinOpen: true,
      currentMidx: null,
      //optional: offset infowindow so it visually sits nicely on top of our marker
      infoOptions: {
        pixelOffset: {
          width: 0,
          height: -35
        }
      },

      markers: [],

},
methods: {
search (terms, done) {
setTimeout(() => {
done(filter(terms, {field: 'value', list: parseLocation()}))
}, 400)
},
selected (item) {

      if(this.$data.obsEntrega == '')
      {
      	Toast.create("Não é possível criar uma corrida de entrega sem descrição");
      	return null;
      }


      this.$data.desinosCarga = '';
      
      if(this.$data.listaDestinosCarga.length > 9)
      {
      	Toast.create("Não é possivel adicionar mais do que 10 destinos");
      	this.$data.obsEntrega = '';
      	return null;
      }
      Toast.create(`Destino Selecionado "${item.label}"`);
      this.$data.listaDestinosCarga.push({obs:this.$data.obsEntrega,label:item.label,nota:0});
      this.$data.obsEntrega = '';
    }

 
setPlace(place) {
	  if(this.markers.length > 0)
	      {
	      	this.markers[0]= {
	            position: {
	              lat: place.geometry.location.lat(),
	              lng: place.geometry.location.lng()
	            },
                infoText: 'Marker 1'
	          };
	      }else{
	      	this.markers.push({
	            position: {
	              lat: place.geometry.location.lat(),
	              lng: place.geometry.location.lng()
	            },
            	infoText: 'Marker 2'
	        });
	      }
	    },
	    usePlace(place) {
	    	console.log('useplace',this.place);
	      if (this.place) {
	      		console.log(this.place);
      		
	      }
	    },
	    setPlace2(place) {

	      	this.markers.push({
	            position: {
	              lat: place.geometry.location.lat(),
	              lng: place.geometry.location.lng()
	            },
                infoText: 'Marker 2'
	        });

	    },
	    getRoute: function () {

		      this.directionsService = new google.maps.DirectionsService()
		      this.directionsDisplay = new google.maps.DirectionsRenderer()
		      this.directionsDisplay.setMap(this.$refs.meumapa.$mapObject)
		      var vm = this
		      //console.log(google-marker);
		      console.log(VueGoogleMaps.Marker);
		      vm.directionsService.route({
		        origin: vm.markers[0].position, // Can be coord or also a search query
		        destination: vm.markers[1].position,
		        travelMode: 'DRIVING'
		      }, function (response, status) {
		        if (status === 'OK') {

		          vm.directionsDisplay.setDirections(response) // draws the polygon to the map

		          vm.$refs.meumapa.resizePreserveCenter();

		        } else {
		          console.log('Directions request failed due to ' + status)
		        }
		      })
		    }
}

`

every thing works fine, i can set the two markers but they dont appear with the description, and when i move the markers on the map they dont refresh the lat and long. After i move them if i set a new route they will create the default markers on the default position and dont create the route for the new positions, Images for example: