Argument of type '"MY_EVENTS_LOAD"' is not assignable to parameter of type 'TakeableChannel<unknown>' in yeild takeLatest

user_2112536 0
Viewed 9122

I have a error on typescript, I'm using Redux and Saga as middleware, these is the error:

No overload matches this call. The last overload gave the following error. Argument of type '"MY_EVENTS_LOAD"' is not assignable to parameter of type 'TakeableChannel'.

I want create a watcher, here:

export default function* watcher() {
  yield takeEvery(actions.MY_EVENTS_LOAD, getListEventsByUserSaga);
}

And in my saga file have the function

export function* getListEventsByUserSaga(OwnerId: string) {
  try {
    const events = yield getEventsByOwnerId(OwnerId);
    yield put(actions.fetchMyEventsListUserSuccess(events));
  } catch (error) {
    yield put(actions.fetchMyEventsListUserFailure(error.message));
  }
}

this happen when I do my action:

export const fetchMyEventsListUserLoad = (OwnerId: string) => {
  return {
    type: MY_EVENTS_LOAD,
    OwnerId,
  };
};

How can implement these of the correct way?

redux-saga typescript reactjs javascript
3 Answers

What you could do (what I did in my case, at least) was what was pointed out in this link. Currently, you seem only to output the OwnerId string to the generator and this shouldn't work like it is, as the generator there basically takes the arguments dispatched, an object with the type and the rest of the arguments sent to the dispatcher. The "correct" way to do would be to have a type definition that encompasses the type, with something like:

type Params = { OwnerId: string, type: string }
export function* getListEventsByUserSaga({ OwnerId }: Params) {
...
}
user_45208440

In your getListEventsByUserSaga generator, you are declaring the action as {OwnerId:string} without a type. If you try to declare it with a type, this will get rid of the error. You can use ReturnType.

export function* getListEventsByUserSaga({OwnerId} : ReturnType<typeof fetchMyEventsListUserLoad>) {
  try {
    // code
  } catch (error) {
    // code
  }
}

https://github.com/redux-saga/redux-saga/issues/1883

user_76091670

instead of

export function* getListEventsByUserSaga(action: { payload: any; }) {
...
//logic
...
}

use this

export function* getListEventsByUserSaga(action: any) {
...
//logic
...
}

it works for me

user_62957120
Related