ค้นหาเว็บไซต์

typescript - ข้อผิดพลาดในการพิมพ์ props โดยใช้ interface ใน Vue 3 (Vue: การเรียกฟังก์ชันที่ไม่ได้กำหนดประเภท อาจไม่รับอาร์กิวเมนต์ประเภทได้)


ฉันต้องการพิมพ์ props โดยใช้ interface นี่คือโค้ดของฉันและมันทำงานได้ถูกต้อง แต่:

defineProps<Props>();

ถูกเน้นด้วยข้อผิดพลาดนี้ (Vue: การเรียกฟังก์ชันที่ไม่ได้พิมพ์ประเภทอาจไม่รับอาร์กิวเมนต์ประเภท)

<script setup lang="ts">
import type { Client } from "@/clients/interfaces/client.interface";

interface Props {
  clients: Client[];
}

const props = defineProps<Props>();
</script>

การอ่านและการค้นหา ฉันพยายามตั้งค่า .eslintrc ด้วย

  env: {
    'vue/setup-compiler-macros': true
  }

และกำลังติดตั้ง "@vue/eslint-config-typescript": "^12.0.0"

ฉันกำลังใช้ WebStorm ฉันไม่แน่ใจว่ามันเกี่ยวข้องหรือไม่ ขอบคุณสำหรับความช่วยเหลือ

คำตอบ #1

ในกรณีของฉัน การตั้งค่า IDE ชี้ไปยัง Typescript ผิด แค่ตรวจสอบให้แน่ใจว่าการตั้งค่า TypeScript ของ IDE ชี้ไปยังเวอร์ชันที่ถูกต้อง:

คำตอบ #2

ตามเอกสาร ไวยากรณ์ที่ใช้ในคำอธิบายปัญหาถูกต้อง แต่ ESLint ไม่ชอบมัน

วิธีแก้ปัญหาที่ฉันนำไปใช้: หนึ่งในตัวเลือกอื่น ๆ ในเอกสารประกอบ เช่น จากโค้ด:

<script setup lang="ts">
interface Book {
  title: string
  author: string
  year: number
}

const props = defineProps<{
  book: Book
}>()
</script>

ด้วยวิธีนี้ ฉันจะไม่เจอข้อผิดพลาด ESLint ฉันสามารถประกาศประเภท prop ด้วยอินเทอร์เฟซที่ตรงกันและโดยไม่ต้องยุ่งยากในการประกาศแต่ละ prop พร้อมกับประเภทของมันและการกำหนดเป็นจำเป็น ฯลฯ

บทความที่เกี่ยวข้อง