Búsqueda de sitios web

reactjs - Ninguna sobrecarga coincide con esta llamada en el efecto call de saga

Quiero pasar la cadena action.url como un parámetro de la función topicDummy, que devuelve una Promesa, pero sigue mostrándome

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.

estos son todos mis códigos.

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`); 
  }
}

Respuesta #1

Cómo reparar un 'TS2769: Ninguna sobrecarga coincide con esta llamada' podría ser relevante,

Sugiere que en lugar de

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

usar

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

const call: any = Effects.call;

También echa un vistazo a https://github.com/redux-saga/redux-saga/issues/2018

También necesitarás resolver la promesa en algún momento, y necesitas "devolver" los datos si quieres usarlos.

Entonces cambia

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

a

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

Respuesta #2

Creo que tuve el mismo problema, y encontré la solución en mi caso.

Tenía este código:

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

Tengo una línea roja ondulada debajo de createProgramDashboard, con este error:

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.

Resulta que el primer parámetro que estaba enviando, programId, era un number, mientras que createProgramDashboard esperaba un string.

Aparentemente, este error se muestra cuando los tipos de algunos de los argumentos enviados a la función call (en mi caso programId: number) no coinciden con los tipos de los parámetros esperados (en mi caso programId: string) por la función que se está llamando, (en mi caso createProgramDashboard).

Entonces esto solucionó el error:

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

Artículos relacionados