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

TypeScript แนะนำคีย์ในอ็อบเจ็กต์


ฉันต้องการกำหนดประเภท TypeScript ซึ่งจะแนะนำคีย์ของอ็อบเจกต์ (ที่แนะนำ) ในตัวแก้ไข แต่ฉันไม่ต้องการจำกัดผู้ใช้ไม่ให้กำหนดคีย์ใด ๆ ก็ได้

ดังนั้นฉันจึงได้กำหนดประเภทต่อไปนี้:

type SuggestedProperties = 'click' | 'change' | 'blur' | string;

นี่คือคุณสมบัติที่ต้องการ: 'click' | 'change' | 'blur' (แต่ฉันต้องการอนุญาต string ใด ๆ ด้วย)

type SuggestedKeysType = Partial<{ [key in SuggestedProperties]: any }>;

ตอนนี้ฉันต้องการให้บรรณาธิการบอกฉันเกี่ยวกับสิ่งเหล่านี้ก่อน: 'click' | 'change' | 'blur'

เป็นไปได้ไหม? ตัวอย่างของฉันถูกต้องหรือไม่? Visual Studio Code/stackblitz:

คำตอบ #1

หากคุณเพิ่ม | string ลงใน SuggestedProperties ประเภททั้งหมดจะถูกลดลงอย่างรวดเร็วเหลือเพียง string ทั้งหมดประเภทตัวอักษร string จะถูกดูดซับในยูเนียน และจากนั้นคอมไพเลอร์และ IDE ของคุณจะลืมทุกอย่างเกี่ยวกับมัน:

type Oops = 'a' | 'b' | string;
// type Oops = string

แทนที่จะเป็นเช่นนั้น คุณควรทำให้ SuggestedKeysType ของคุณเป็นชนิดที่มีทั้งคีย์ที่ทราบแล้วและลายเซ็นดัชนีแบบสตริง อาจเป็นแบบนี้:

type SuggestedProperties = 'click' | 'change' | 'blur';

type SuggestedKeysType = { [K in SuggestedProperties]?: any } & { [k: string]: any }

แล้วคุณจะได้รับข้อเสนอแนะตามที่คุณคาดหวัง:

const myObject: SuggestedKeysType = {
  foo: 1,
  bar: 2,
  click: 3,
  // Suggestions here:
  // ☐ blur, (property) blur?: any
  // ☐ change, (property) change?: any
}

ลิงก์ Playground ไปยังโค้ด

คำตอบ #2

ฉันไม่รู้ว่ามีวิธีแก้ปัญหาที่ดีกว่านี้หรือไม่ แต่วิธีนี้ใช้ได้:

type MyObj = Partial<
  {
    [key in SuggestedProperties]: any;
  } & {
    [index: string]: any;
  }
>;

การเติมข้อความอัตโนมัติจะเสนอ SuggestedProperties ก่อน และคุณสามารถส่งผ่านคุณสมบัติอื่นใดก็ได้

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