Necesito guardar coordenadas en la base de datos desde una app Vue y la API creada en Laravel, probé la api de laravel con postman y guarda perfectamente, el problema es cuando quiero guardar las coordenadas desde la aplicación en vue.. Este es el codigo que les comparto porque es el que me da problemas, el resto del codigo no tiene problemas, probe otra app con un formulario sencillo y donde los valores se ingresan por teclaro como en la descripcion en este ejemplo y guarda los datos sin problemas, el problema es que no se como guardar las coordenadas en el data() form lng, lat sin tener que ingresarlos yo mismo, quiero que se guardar los valores desde los metodos al dar click en el botón
<template>
<div class="ion-save-loca">
<ion-item class='items'>
<ion-label color = 'primary' position = 'stacked'>Novedades</ion-label>
<ion-input :value='form.descripcion' @ionInput='form.descripcion =
$event.target.value' type = 'text' placeholder = 'Descripcion'></ion-input>
</ion-item>
<ion-item lines = 'none'>
<ion-button fill="outline" shape ='round'
@click="get_location;guardar()">Guardar datos</ion-button>
</ion-item>
</div>
</template>
<script>/* eslint-disable */
import axios from 'axios'
export default {
name: 'Localizacion',
data () {
return {
form: {
lng: '', //en esta linea quiero guardar las coordenadas
lat: ' ', //en esta linea quiero guardar las coordenadas
descripcion: '' //este valor que es por pantalla si lo guarda
}
}
},
methods:{
guardar(){
let formData = new FormData();
this.get_location;
formData.append('data', JSON.stringify(this.form))
axios.post('http://localhost:8000/api/guardar', formData,{
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(function(response){
console.log(response.data);
})
},
get_location: function () { //obtiene localozacion actual
var geo_options = {
enableHighAccuracy: true,
maximumAge : 30000,
timeout : 30000
};
var wpid = navigator.geolocation.watchPosition(this.geo_success,
this.geo_error, geo_options, this.geo_lon, this.geo_lat);
},
geo_success: function (position) { //obtiene coordenadas actuales, estos son
los valores que quiero guardar en la BD
console.log(position.coords.longitude + " - " + position.coords.latitude);
},
geo_error: function () {
console.log("Error!!!");
},
geo_lon: function(position){ //trate de almacenar en las variables del form
//las coordenadas con esta función pero no me sirve
this.lng = position.coords.longitude;
return this.lng;
},
geo_lat: function(position){ //trate de almacenar en las variables del form
//las coordenadas con esta función pero no me sirve
this.lat = position.coords.latitude;
return this.lat;
},
Este código no me bota ningún error, simplemente no guarda las coordenadas,
llevo tiempo en esto he probado poniendo directamente en
data () {
return {
form: {
lng: '', // lng: 'geo_lon', probé esto pero ahí si me salta error
lat: ' ',
descripcion: ''
}
}
},
También probé declarando al inicio
var lon = geo_lon;
y luego pasandole el valor
form.lng = lon