我創建了一個 React 鉤子:
interface Person {
name: string
age: number
}
export const usePerson = function <T extends Person, K extends keyof T>(): (property: K, setter: (value: T[K]) => T[K]) => void {
const setPersonProperty = (property: K, setter: (value: T[K]) => T[K]): void => {
console.log(property, setter)
}
setPersonProperty('name', (x) => x)
return setPersonProperty;
}
我已經<T, K extends keyof T>從打字稿檔案中看到了該模式,但我無法在我的示例中正確使用它。
更具體地說,打字稿在線上抱怨
setPersonProperty('name', (x) => x)
雖然當我開始輸入setPersonProperty('n /* IDE autocompletes name */但抱怨'name'引數時,我收到以下錯誤:
Argument of type 'string' is not assignable to parameter of type 'K'. 'string' is assignable to the constraint of type 'K', but 'K' could be instantiated with a different subtype of constraint 'string | number | symbol'.
我還從我的 IDE 中發布了一張圖片。我正在使用打字稿 4 。[![在此處輸入影像描述][1]][1]
我在這里做錯了什么?[1]:https : //i.stack.imgur.com/WzJE5.png
uj5u.com熱心網友回復:
我打賭這就是你想要達到的結果
type Person = {
name: string,
age: number
};
export const usePerson = function <T extends Person>() {
const setPersonProperty = <K extends keyof T> (property: K, setter: (value: T[K]) => T[K]): void => {
console.log(property, setter)
}
setPersonProperty("name", (x) => x)
return setPersonProperty;
}
const setPerson = usePerson<Person>()
setPerson("name", (name) => name)
基本上,在您提供的代碼中,在呼叫這個 usePerson 鉤子T和K( <T extends Person, K extends keyof T>)時有兩種通用型別。
假設有人會用usePerson<Person, "age">(). 什么打字稿會做它將替換里面的型別我們usePerson要T = Person和K = "age"
現在你有一個不匹配,因為setPersonProperty有第一個 K 型別的引數(“年齡”),引數“名稱”是不可分配的 - 你看到的錯誤。
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/387155.html
上一篇:重繪瀏覽器后顯示來自localStorage的收藏項-Next.js&Typescript專案
下一篇:已解決的承諾型別
