如何修复“TS2769：没有超载匹配此调用”答案

【问题标题】：How to repair a 'TS2769: No overload matches this call'如何修复“TS2769：没有超载匹配此调用”
【发布时间】：2020-02-18 12:22:56
【问题描述】：

包更新后，我突然收到奇怪的打字错误：

[tsl] C:..\UI\src\sagas.ts(40,21) 中的错误 TS2769：没有与此调用匹配的重载。

最后一次重载出现以下错误。 '"LOAD_IDS"' 类型的参数不能分配给 'TakeableChannel' 类型的参数。

sagas.ts对应的39-41行是

function* watchIds() {
    yield takeEvery(Actions.LOAD_IDS, loadIds);
}

函数function* loadIds({ forceReload }) 定义在同一个sagas.ts 中，只是API 调用。

TS 错误是什么意思，我该如何解决？

我的packages.json 看起来像这样：https://pastebin.com/raw/nJ0cPNXb
也许也很重要：我的webpack.config.js 是https://pastebin.com/raw/JNdXTCMb

参考文献

【问题讨论】：

标签： javascript reactjs typescript webpack

【解决方案1】：

我的同事最终教了我一个解决方法：

排除相应的操作，例如takeEvery 来自原始 import 声明。
使用as Eff 导入所有操作，其中Eff 是别名。
定义一个与原始操作同名的新常量。

import { put, fork, select, call } from 'redux-saga/effects' // <-- modified
import * as Eff from 'redux-saga/effects'  // <-- new

// ... 

const takeEvery: any = Eff.takeEvery;      // <-- new
const takeLatest: any = Eff.takeLatest;    // <-- new

据我了解，这个想法是明确允许any 类型。

编辑：我知道 Facebook（作为 React 的开发者）确实明确声明应该不使用继承，请参阅 https://reactjs.org/docs/composition-vs-inheritance.html

【讨论】：

【解决方案2】：

我也遇到了这个问题，但是我问了我的同事，得知了以下解决方法：

redux-saga 采用 TakeableChannel<unknown>。这是一个动作，所以你声明 loadIds 的参数类型是这样的动作形状：

function* loadIds({
   forceReload
}: { 
   type: string;
   forceReload: any; // your forceReload type
}) {
   // your code
}

【讨论】：