Tengo el siguiente problema: estoy trabajando en un proyecto de mapa de capa abierta vue.js. En mi sección montada () tengo un controlador de eventos que escucha el movimiento de las características en el mapa. Las nuevas coordenadas se muestran bien en el archivo console.log dentro de mi detector de eventos. Ahora, me gustaría mostrar la nueva coordenada en un campo de texto v de vuetify con modelo v y luego almacenarlo en la tienda vuex. Mi problema es que los datos de coordenadas asignados a this.coordinate dentro del detector de eventos no están disponibles dentro de vuetify v-text-field. Pasé varios nuestros probando muchas cosas diferentes. A pesar de decenas de búsquedas en la web no encontré una solución.
Cualquier sugerencia es bienvenida.
Debajo del esqueleto del código:
<script> export default { data() { return { coordinates: [0,0] } }, mounted() { [...] selectedFeature.on('add', function(event) { // now we create an listener on change events var feature = event.element; feature.on('change', function(event){ let waypFeature = event.target.clone(); let waypCoord = waypFeature.getGeometry().transform('EPSG:3857', 'EPSG:4326').getCoordinates(); console.log("selectedFeature(change) / Coordinates waypCoord: %s/%s", waypCoord[0], waypCoord[1]) this.coordinates /* I search for aa way to write the array waypCoord into the array test defined in data (ultimately I need to write array into the vuex store) */ }) }) // setup map const map = new Map({ layers: layer, target: 'map', view: view, }); }, } </script> <template> <v-form v-model="formValidity"> <v-card> <!-- Section for main data --> <v-card-text class="my-5"> <v-row> <v-col cols="12"> <!-- v-model keeps displaying the initial value [0,0] --> <v-text-field v-model="coordinates" label="Remarks" type="text" dense /> </v-col> </v-row> </v-card-text> </v-card> </v-form> </template>