Sam
Sam

Reputation: 30388

Getting simple epic working in redux-observable

Trying to implement my first simple epic using redux-observable but running into two issues:

  1. After I hit my break point, I get an error that reads "Cannot read property 'closed' of undefined" and after that I don't hit the break point in my epic -- see below enter image description here
  2. Once I hit my epic, I want to dispatch myAction which is an action creator. Not sure how to add dispatch. Initially, I didn't add anything and got dispatch not defined error. Then I noticed that my IDE automatically added import { dispatch } from 'rxjs/internal/observable/pairs';. Not sure if this is the way to add dispatch to my epic. This could also be the reason for the error.

The fact that I'm initially hitting my epic when a particular action is fired, tells me that it's successfully added into the middleware pipeline but clearly something is not right.

Here's what my epic looks like:

import { Observable } from 'rxjs';
import { ofType } from 'redux-observable';
import { filter, map, mapTo } from 'rxjs/operators';
import { dispatch } from 'rxjs/internal/observable/pairs'; // ??? Is this how I access dispatch?

import * as types from '../../actions/action-types';
import { myAction} from '../../actions/my-actions';

export const mySimpleEpic = (action$, state$) => action$.pipe(

    ofType(types.SOMETHING_HAS_HAPPENED),
    map(() => {
        debugger
        dispatch(myAction("Hello World!"))
    })
)

What am I doing wrong?

Upvotes: 1

Views: 1074

Answers (1)

Sylvain
Sylvain

Reputation: 19249

Epics don't dispatch actions, they emit actions. It's redux-observable who dispatches the actions emitted from your epics. The basic epic structure should be something like:

export const mySimpleEpic = action$ => 
    action$
    .ofType(types.SOMETHING_HAS_HAPPENED)
    .map(() => myAction("Hello World!"));

Upvotes: 1

Related Questions