reactjs - Ingen överlagring matchar detta anrop i saga call-effekt

Jag vill skicka action.url-strängen som en parameter till topicDummy-funktionen som returnerar ett Promise, men det fortsätter att visa mig

No overload matches this call.
  The last overload gave the following error.
    Argument of type '<TopicData>(url: string) => Promise<TopicData>' is not assignable to parameter of type '{ context: unknown; fn: (this: unknown, ...args: any[]) => any; }'.
      Type '<TopicData>(url: string) => Promise<TopicData>' is missing the following properties from type '{ context: unknown; fn: (this: unknown, ...args: any[]) => any; }': context, fnts(2769)
effects.d.ts(499, 17): The last overload is declared here.

detta är alla mina koder.

export type TopicData = {
  name: TopicName
  data: CardData[]
}
const dummyTopicData: TopicData = Object.assign({
  topic: 'etc',
  data: dummyData()
}, )
function topicDummy<TopicData>(url: string): Promise<TopicData> {
  return new Promise((resolve, reject) => {
    setTimeout(() => 
      dummyTopicData 
    , 700);  
  })   
}

function* fetchTopic(action: DispatchAction){
  try{
    yield put(topicCreator.load()); 
    const topicList = yield call(topicDummy, action.url); // <- complain here. 
    yield put(topicCreator.success(topicList));
  } catch(error){
    throw new Error(`Error exist in fetchTopic function`); 
  }
}

Svar #1

Hur man reparerar en 'TS2769: Ingen överlagring matchar detta anrop' kan vara relevant,

Det föreslår att istället för

import {call} from "redux-saga/effects";

att använda

import * as Effects from "redux-saga/effects";

const call: any = Effects.call;

Ta också en titt på https://github.com/redux-saga/redux-saga/issues/2018

Du kommer också att behöva lösa löftet vid en tidpunkt, och du behöver "returnera" datan om du vill använda dem.

Så förändra

return new Promise((resolve, reject) => {
    setTimeout(() => 
      dummyTopicData 
    , 700);  
  })

till

return new Promise((resolve, reject) => {
    setTimeout(() => 
      resolve(dummyTopicData)
    , 700);  
  })

Svar #2

Jag tror att jag hade samma problem, och jag hittade lösningen i mitt fall.

Jag hade den här koden:

    const {dashboardId} = yield call(
      createProgramDashboard,
      programId,
      name,
      type
    );

Jag fick en röd vågig linje under createProgramDashboard, med detta fel:

No overload matches this call.
  The last overload gave the following error.
    Argument of type '(programId: string, name: string, type: REPORT_TYPE) => Promise<Dictionary>' is not assignable to parameter of type '{ context: unknown; fn: (this: unknown, ...args: any[]) => any; }'.
      Type '(programId: string, name: string, type: REPORT_TYPE) => Promise<Dictionary<any>>' is missing the following properties from type '{ context: unknown; fn: (this: unknown, ...args: any[]) => any; }': context, fnts(2769)
effects.d.ts(499, 17): The last overload is declared here.

Det visar sig att den första parametern jag skickade in, programId, var ett nummer, medan createProgramDashboard förväntade sig en sträng.

Tydligen visas detta fel när typerna för några av argumenten som skickas till call-funktionen (i mitt fall programId: number) inte matchar typerna för de parametrar som förväntas (i mitt fall programId: string) av den funktion som anropas, (i mitt fall createProgramDashboard).

Så det här fixade felet:

    const {dashboardId} = yield call(
      createProgramDashboard,
      programId.toString(),
      name,
      type
    );

Relaterade artiklar