Estoy tratando de crear una aplicación con capacidades de enrutamiento y para esto, necesito usar la API OpenRouteService-JS. La forma en que tengo esta configuración es, lo que supongo que es, en una promesa.
No puedo sacar la matriz de la promesa, he intentado usar una función asíncrona con await pero parece que no devuelve nada y no sé si la promesa está mal configurada o si la función asíncrona está mal configurada .
Aquí está la promesa:
function getRoute() { var openrouteservice = require("openrouteservice-js"); var Directions = new openrouteservice.Directions({ api_key: "######"}); // Direction Request Directions.calculate({ coordinates: [[8.690958, 49.404662], [8.687868, 49.390139]], profile: 'foot-walking', extra_info: ['waytype', 'steepness'], format: 'geojson' }) .then(function(geojson) { // Add your own result handling here var PolyLine = geojson.features[0].geometry.coordinates.map(c => ({latitude: c[0], longitude: c[1]})) console.log(PolyLine); return PolyLine }) .catch(function(err) { var str = "An error occurred: " + err; console.log(str); }); }Así es como estoy tratando de recopilarlo:
React.useEffect(() => { async function getPolyLine() { const res = await getRoute(); // type: Promise<Interface> console.log(res) setPolyLine(res); } getPolyLine(); }, []) const [polyline, setPolyLine] = React.useState()No tengo experiencia real con Javascript o React y las promesas han sido un problema interesante con el que tropezar.
Debe agregar una declaración de devolución como esta:
function getRoute() { var openrouteservice = require("openrouteservice-js"); var Directions = new openrouteservice.Directions({ api_key: "######"}); // Direction Request return Directions.calculate({ coordinates: [[8.690958, 49.404662], [8.687868, 49.390139]], profile: 'foot-walking', extra_info: ['waytype', 'steepness'], format: 'geojson' }) .then(function(geojson) { // Add your own result handling here var PolyLine = geojson.features[0].geometry.coordinates.map(c => ({latitude: c[0], longitude: c[1]})) console.log(PolyLine); return PolyLine }) .catch(function(err) { var str = "An error occurred: " + err; console.log(str); }); }Entonces, en su código, en realidad no está devolviendo la promesa.
Creo que aquí tenemos que crear nuestra Promesa personalizada y resolverla con valores posibles para devolver un valor a nuestra declaración deseada.
Como aquí JavaScript, no podemos devolver declaraciones directamente desde funciones internas como lo intentó en la cláusula entonces.
Intente con los siguientes cambios, espero que resuelva su problema:
function getRoute() { var openrouteservice = require("openrouteservice-js"); var Directions = new openrouteservice.Directions({ api_key: "######"}); return new Promise((resolve, reject) => { // Direction Request Directions.calculate({ coordinates: [[8.690958, 49.404662], [8.687868, 49.390139]], profile: 'foot-walking', extra_info: ['waytype', 'steepness'], format: 'geojson' }) .then(function(geojson) { // Add your own result handling here var PolyLine = geojson.features[0].geometry.coordinates.map(c => ({latitude: c[0], longitude: c[1]})) console.log(PolyLine); resolve(PolyLine) }) .catch(function(err) { var str = "An error occurred: " + err; console.log(str); resolve([]) }); }) }