當我有這個時：
interface PropTypes {
user?: {
name?: string,
age?: number
}
}
const Comp = (props: PropTypes) => ...
為什么這樣有效：
const user = {
random: 3,
name: 'test'
}
<Comp user={user} /> // works
但這不會（將值從變數移動到此處）：
<Comp user={{ random: 3, name: 'test' }} /> // does not work
此外，當我從用戶那里洗掉所有已知屬性時，它不再起作用：
const user = {
random: 3
}
<Comp user={user} /> // does not work
我想知道為什么它會這樣作業。為什么它接受“隨機”道具，當它處于可變狀態時，這對他來說是未知的。為什么變數型別的行為與直接傳遞道具不同？有沒有辦法只允許精確的道具而不每次都給變數指定型別？
uj5u.com熱心網友回復：
這與 Typescript 的Excess Property Checking有關。
結構型別系統：TypeScript 可以擁有額外的屬性，只要您提供具有其所需屬性的型別。
當 TypeScript 在賦值中遇到物件字面量或作為引數傳遞給函式時，它會觸發一個稱為Excess Property Checking的操作。與結構型別相反，它檢查物件是否具有確切的屬性。
一種有趣的行為是“弱型別”——所有欄位都標記為可選的型別。在這種情況下，即使在分配中間變數時也會發生多余的屬性檢查動作。
您可以在此鏈接上閱讀更多內容。
案例 1 - 結構型別系統
const user = {
random: 3,
name: 'test'
}
<Comp user={user} /> // works
在這種情況下，型別user推斷為：
{
random: number;
name: string;
}
此型別與 兼容PropTypes，因此沒有錯誤。
案例 2 - 過多的屬性檢查
在賦值中傳遞物件字面量：
<Comp user={{ random: 3, name: 'test' }} /> // does not work
在這種情況下random不是 type 的有效屬性PropTypes，因此 typescript 會告訴您添加random是錯誤的。
物件字面量只能指定已知屬性，并且在型別 '{ name?: string | 中不存在 'random' 不明確的; 年齡？：數字 | 不明確的; }'
案例 3 - 弱型別
const user = {
random: 3
}
<Comp user={user} /> // does not work
在這種情況下，打字稿將用戶型別推斷為：
{
random: number;
}
在這種情況下random， 的屬性也是無效的PropTypes，因此這是一個錯誤。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/450523.html