使用useCallback包裹後，引數型別就變成了any

龙陌發表於2024-03-17
型別

在使用React的useCallback Hook時，如果直接包裹一個函式而沒有提供型別引數，TypeScript會預設認為回撥函式的引數型別為any。這是因為useCallback Hook接受兩個引數，第一個是回撥函式，第二個是一個依賴陣列，而TypeScript在沒有明確指定型別的情況下無法推斷回撥函式的引數型別。

要解決這個問題，你應該為回撥函式指定明確的型別。例如，如果你的回撥函式接收一個特定型別的引數，可以這樣定義：

const handleChange: (value: string, record: RecordType) => void = useCallback(
  (value, record) => {
    // 你的處理邏輯
  },
  [dependencyList], // 依賴項陣列
);

這裡RecordType是你需要的具體型別，可以根據實際情況進行替換。

另外，如果你希望useCallback返回的函式保持與原始函式相同的型別簽名，也可以在宣告時直接指定型別：

const handleChange = useCallback<(value: string, record: RecordType) => void>(
  (value, record) => {
    // 你的處理邏輯
  },
  [dependencyList],
);

這樣，即使在useCallback內部，TypeScript也能正確推斷出函式引數的型別。

相關文章