vue.js - TypeScript-fel 'Type '($event: any) => void' kan inte tilldelas typen' när man lyssnar på ett evenemang i Vue 3

Komponentkod:

<h2 @click="handleEvent(post.id)">{{ post.title }}</h2>

function handleEvent(id: number) {
  router.push("/post/" + id);
}

Typescript-fel:

Type '($event: any) => void' is not assignable to type 'MouseEvent'.ts(2322)
__VLS_types.ts(107, 56): The expected type comes from property 'click' which is declared here on type 'EventObject<undefined, "click", {}, MouseEvent | undefined>'

Vad är problemet?

Svar #1

Så vitt jag förstår har vi i denna fråga två alternativ:

  1. lägg till @types/node: '18.8.0'
  2. vänta tills denna ändring har slås ihop till en Vue 2.7-utgåva

notera: Använd inte ^, fixa versionen till 18.0.0

Jag installerar den fasta versionen av @types/node och det fungerar för mig.

Svar #2

TL;DR: Nedgradera @types/node till 18.8.0 tills vue 3.2.41 släpps.

Vi har stött på samma problem under de senaste dagarna men tror att vi har en lösning.

Visade sig vara en konflikt mellan vue 3.2.40 och @types/node 18.8.5. Den nuvarande versionen av vue är inte kompatibel (men 3.2.41 bör lösa detta) med de senaste node-typerna.

Steg jag tog för att åtgärda problemet:

  1. Återställ @types/node till 18.8.0 utan ^
  2. Ta bort node-moduler - här är ett användbart skript vi använder för detta: find . -name 'node_modules' -type d -prune -print -exec rm -rf '{}' \\; eftersom vi använder ett monorepo med Yarn-arbetsytor
  3. Installera om beroenden
  4. Ladda om VS Code - cmd+shift+p och sök efter Developer: Reload Window

Relaterade artiklar