假設我有這個 TypeScript 代碼：
enum EVENT {
FIRST_EVENT = "game:first_encounter",
}
const EventHandler: keyof typeof EVENT = {
[EVENT.FIRST_EVENT]: (data: any) => {
console.log(`Hello there, ${data.blue_player}`);
}
}
const data = { blue_player: 'Blue McBlue', event: EVENT.FIRST_EVENT}
const eventName: EVENT = data.event;
EventHandler[eventName](data);
EventHandler我在頂部附近有一個錯誤。
Type '{ "game:first_encounter": (data: any) => void; }' is not assignable to type '"FIRST_EVENT"'
eventName我在最后一行也有一個錯誤：
Element implicitly has an 'any' type because index expression is not of type 'number'
https://www.typescriptlang.org/play?#code/KYOwrgtgBAogajAcgFSgbwFBSgMQJIBKAysgPrxKoC8UARAOYCGEwAXAGYCWATgM4AupUAGMA9mBD9g3WgBoMAXwwYxIAbABuofgAlGIACYAbaaygBrYAE9R7KPysAHYLc3aoNTNmwBtCigA6fGIyf2QAXTMACgNGfkYzfSsASg8APnQsb2zVXlETAKNReiiAAx1gIyL7AAtpYFkoABI0WPiAgCMjMGBSRyNGK2kFUuSAbizsJSUVUTV KDbGD3QoLp6 gaHuMwByACFu4CgAWWFDnt3G4C1JMzCgwhJyBBQlXIWb7URmNlhX6iLOKMAJfSQTDAwW66fTGaQ MH8H4scIxYHjIA
明白了嗎？我怎樣才能正確輸入這個？
uj5u.com熱心網友回復：
讓我們開始輸入EventHandler并解決這個問題。
首先它是一個物件：
type EventHandlerType = {};
它的鍵是事件
// Create a mapped type mapping events to anything
type EventHandlerType = { [e in EVENT]: any }
每個值都是一個接受資料引數并回傳 void 的函式
// Create a mapped type mapping events to anything
type EventHandlerType = { [e in EVENT]: (data: any) => void };
哪個應該在您的代碼中起作用：
const EventHandler: { [key in EVENT]: (data: any) => void } = {
[EVENT.FIRST_EVENT]: (data: any) => {
console.log(`Hello there, ${data.blue_player}`);
}
}
Record對于這些情況存在的內置實用程式型別使這變得更簡單：
const EventHandler: Record<EVENT, (data: any) => void> = {
[EVENT.FIRST_EVENT]: (data: any) => {
console.log(`Hello there, ${data.blue_player}`);
}
}
有關更多示例和深入了解，請參閱檔案中的映射型別。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/414484.html
標籤：