TS nampaknya berpendapat bahawa jenis nilai prop terinterpolasi adalah seperti berikut:
{ href: `#234${undefined}2213` }
Bukan rentetan (apabila ia digunakan dalam kesatuan yang boleh dibezakan)?
Taip inferens untuk medan p3
实例会丢失 ev
ketiga di bawah, tetapi hanya jika href ialah rentetan esliteral yang diinterpolasi.
type BiomePlainLinkProps = { href: string; onClick?: (event: string) => void; } type BiomeButtonProps = { href?: never; onClick?: (event: number) => void; } export type ClickableDiscriminatedUnion = | BiomePlainLinkProps | BiomeButtonProps; const p1: ClickableDiscriminatedUnion = { href: '2332132', onClick: (ev) => console.log('@@@@', ev), // ev is string here } const p2: ClickableDiscriminatedUnion = { onClick: (ev) => console.log('@@@@', ev), // ev is number here } const p3: ClickableDiscriminatedUnion = { href: `2${undefined}332132`, onClick: (ev) => console.log('@@@@', ev), // ev is any (not string) here }
TS kotak pasir pembiakan lengkap
Dikemas kini TS5.2+
Pepijat ini telah dibetulkan dalam microsoft/TypeScript#53907, jadi mulai TypeScript 5.2, kod dalam soalan akan berfungsi seperti yang diharapkan tanpa sebarang perubahan.
Gunakan pautan Taman Permainan TS 5.2.0-dev.20230516
Jawapan asal untuk TS5.1-
Ternyataya, ini adalah pepijat dalam TypeScript, seperti microsoft/TypeScript#53888, yang saya serahkan sebagai jawapan kepada soalan Stack Overflow. Pengkompil nampaknya menyedari bahawa atribut diskriminasi
href
adalah jenisstring
dan bukanundefined
, tetapi ini berlaku terlalu lewat Masukkan parameter panggil balikhref
是string
类型,而不是undefined
,但这发生得太晚了 根据上下文输入onClick
onClick
mengikut konteks. Agaknya, interpolasi literal templat sudah cukup untuk menangguhkan perkara yang menyebabkan masalah.Isu GitHub adalah dalam Backlog, yang bermaksud pasukan TS tidak merancang untuk membetulkannya dalam masa terdekat... tetapi oleh itu ia juga ditandakan sebagai Memerlukan Bantuan a>, yang bermaksud mereka akan menerima permintaan tarik daripada ahli komuniti; Oleh itu, sesiapa yang berharap dapat menyelesaikan isu ini secepat mungkin harus mempertimbangkan untuk menyumbang sendiri.
Sementara itu, penyelesaian yang saya cadangkan di sini ialah melakukan interpolasi rentetan lebih awal dan menyimpannya dalam
const
supaya jenisnya diketahui lebih awal:Ia menjengkelkan (mungkin lebih menjengkelkan untuk JSX), tetapi sekurang-kurangnya ia berkesan!