ionic-team / ionic-team/ionic-native-google-maps

Error: GeocoderResult[] (Ionic 5 & Vue 3)

Abierto
#368 0 comentarios 0 reacciones 0 asignados Ver en GitHub
Lenguaje dominante
TypeScript
Estrellas
215
Forks
119
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

Hi, first of all. This is my first experience for using this cordova plugin (i am using capacitor v3).

```typescript
Argument of type '(results: GeocoderResult[]) => null | undefined' is not assignable to parameter of type '(value: GeocoderResult[] | BaseArrayClass) => PromiseLike | null | undefined'.
Types of parameters 'results' and 'value' are incompatible.
Type 'GeocoderResult[] | BaseArrayClass' is not assignable to type 'GeocoderResult[]'.
Type 'BaseArrayClass' is missing the following properties from type 'GeocoderResult[]': length, concat, join, shift, and 20 more.
159 | "lng": coordinates.value.coords.longitude
```

This error came up, when i decided to use this plugin with Ionic 5 & Vue 3. I have this error, that i couldn't find out the solution.

Here's my package.json (Open this up)

```json
"dependencies": {
"@capacitor/android": "3.3.2",
"@capacitor/app": "^1.0.6",
"@capacitor/core": "^3.3.2",
"@capacitor/dialog": "^1.0.2",
"@capacitor/geolocation": "^1.2.0",
"@capacitor/haptics": "^1.1.3",
"@capacitor/keyboard": "^1.1.3",
"@capacitor/local-notifications": "^1.0.9",
"@capacitor/status-bar": "^1.0.6",
"@ionic-native/core": "^5.22.0-beta-1",
"@ionic-native/google-maps": "^5.27.0-beta-20200630",
"@ionic-native/native-geocoder": "^5.36.0",
"@ionic/vue": "~5.6.13",
"@ionic/vue-router": "~5.6.13",
"cordova-plugin-googlemaps": "^2.7.1",
"cordova-plugin-nativegeocoder": "^3.4.1",
"core-js": "^3.8.3",
"vue": "^3.2.6",
"vue-router": "^4.0.11"
},
"devDependencies": {
"@capacitor-community/sqlite": "^3.0.0-rc.2",
"@capacitor/cli": "^3.2.5",
"@ionic/app-scripts": "^3.2.4",
"@types/jest": "^24.0.19",
"@typescript-eslint/eslint-plugin": "^4.15.1",
"@typescript-eslint/parser": "^4.15.1",
"@vue/cli-plugin-babel": "~4.5.13",
"@vue/cli-plugin-e2e-cypress": "~4.5.13",
"@vue/cli-plugin-eslint": "~4.5.13",
"@vue/cli-plugin-router": "~4.5.13",
"@vue/cli-plugin-typescript": "~4.5.13",
"@vue/cli-plugin-unit-jest": "~4.5.13",
"@vue/cli-service": "~4.5.13",
"@vue/compiler-sfc": "^3.0.4",
"@vue/eslint-config-typescript": "^7.0.0",
"@vue/test-utils": "^2.0.0-0",
"copy-webpack-plugin": "^5.1.2",
"eslint": "~6.8.0",
"eslint-plugin-vue": "^7.0.0-0",
"jeep-sqlite": "^1.3.2",
"typescript": "~4.1.5",
"vue-jest": "^5.0.0-0",
"vue-sqlite-hook": "^2.1.4"
}
```

Here's my Vue component (Open this up)

```vue

import {
GoogleMaps,
GoogleMap,
GoogleMapsEvent,
GoogleMapOptions,
Geocoder,
GeocoderResult,
Marker
} from '@ionic-native/google-maps';
import { defineComponent, ref } from "vue";

export default defineComponent({
.....
setup() {
// form values
const origin = ref<string>("");
const destination = ref<string>("");
const coordinates = ref<any>({});
const googleMap = ref<GoogleMap>();

const loadMap = () => {
Geocoder.geocode({
"position": {
"lat": coordinates.value.coords.latitude,
"lng": coordinates.value.coords.longitude
}
}).then((results: GeocoderResult[]) => {
if (results.length == 0) {
// Not found
return null;
}
let address: any = [
results[0].subThoroughfare || "",
results[0].thoroughfare || "",
results[0].locality || "",
results[0].adminArea || "",
results[0].postalCode || "",
results[0].country || ""].join(", ");
});
};

return {
....
// Data
origin,
destination,
...

// Methods
....
loadMap,
};
}
});

```

Sorry, i can't show you the full code, because. it's too long and it's not what i want to ask. But the issue what i am talking is about the error above this code. I could really use some help.

Guía de contribución

Abrir la guía de contribución

Línea de trabajo

Start with the Geocoder.geocode call in the shown Vue component and inspect the TypeScript declaration for its callback value, especially the GeocoderResult[] | BaseArrayClass union. Reproduce the error with the listed package versions using the project's TypeScript check. Done means the intended geocoding callback type is compatible and the component compiles without this error.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
typescript
Área
mobile
Tipo de issue
Error
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Estancado
Claridad
Necesita aclaración
Aptitud para principiantes
25/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.