typescript - Eigenschaft X existiert nicht auf Typ ‚Vue‘, wenn man this.$parent.somePropOrMethod und this.$root.somePropOrMethod verwendet

Beim Verwenden von VueJS mit TypeScript führt der Zugriff auf eine Eigenschaft oder Methode über this.$parent.somePropOrMethod oder this.$root.somePropOrMethod zu einem Typfehler Property somePropOrMethod does not exist on type 'Vue'

Die Schnittstelle für Vue ist

export interface Vue {
   ...
   readonly $parent: Vue;
   readonly $root: Vue;
   ...
   }

Wie sollen wir also auf Eigenschaften und Methoden der übergeordneten oder Wurzelelemente auf typsichere Weise zugreifen?

Es scheint, dass das Interface Vue & {[key: string]: any} sein sollte, um unbekannte Eigenschaften und Methoden auf den $root- und $parent-Eigenschaften zuzulassen.

Antwort #1

Bei TypeScript-Typfehlern löse ich das normalerweise, indem ich ein benutzerdefiniertes Interface erweitere oder auf any setze. Aber ich bin mir nicht sicher, ob das ein Standardmuster ist ...

Benutzerdefinierte Schnittstelle

export interface _Vue extends Vue {
  somePropOrMethod: any,
  forStringProp: String
}

Oder als beliebig festlegen

(this.$parent as any).somePropOrMethod