Epic не возвращает поток в Redux-Observable

Я тестирую redux-observable с побочным проектом и неоднократно сталкиваюсь с этой проблемой: Uncaught TypeError: combineEpics: one of the provided Epics "handleSearchEpic" does not return a stream. Double check you're not missing a return statement!

Я сослался на наблюдаемые документы redux и несколько других примеров в Интернете, но я не могу определить, что мне может не хватать. Ниже представлены мои действия и рассматриваемая эпопея.

export const searchContent = query => {
  return {
    type: SEARCH_CONTENT,
    query
  }
}

const returnSearchContent = searchResults => {
  return function(dispatch) {
    dispatch({
      type: RETURN_SEARCH_CONTENT,
      searchResults
    });
  }
}

// Epics
export const handleSearchEpic = action$ => {
  action$.ofType(SEARCH_CONTENT)
    .mergeMap(action => axios.get(`...SOME_API_ENDPOINT`))
    .map(res => returnSearchContent(res))
}

export const rootEpic = combineEpics(
  handleSearchEpic
);

Вот корень приложения и конфигурация магазина:

const epicMiddleware = createEpicMiddleware(rootEpic);
const store = createStore(Reducer, applyMiddleware(epicMiddleware));

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById('root')
);

person Jose    schedule 13.05.2017    source источник


Ответы (1)


Ваш handleSearchEpic эпик представляет собой стрелочную функцию с блоком, но на самом деле не возвращает поток.

Плохой

export const handleSearchEpic = action$ => { // <-- start of block
  // vvvvvvv missing return
  action$.ofType(SEARCH_CONTENT)
    .mergeMap(action => axios.get(`...SOME_API_ENDPOINT`))
    .map(res => returnSearchContent(res))
} // <-- end of block

Хороший

export const handleSearchEpic = action$ => {
  return action$.ofType(SEARCH_CONTENT)
    .mergeMap(action => axios.get(`...SOME_API_ENDPOINT`))
    .map(res => returnSearchContent(res))
}

Неявный возврат?

В качестве альтернативы вы можете удалить блок и использовать неявный возврат, что может быть тем, что вы хотели сделать?

export const handleSearchEpic = action$ => // <--- no block
  action$.ofType(SEARCH_CONTENT)
    .mergeMap(action => axios.get(`...SOME_API_ENDPOINT`))
    .map(res => returnSearchContent(res));

Очень распространенная ошибка, поэтому я добавил сообщение об ошибке, которое вы указали, но оно, похоже, не сделало решение понятным. Есть предложения, как я могу улучшить сообщение об ошибке?

combEpics: один из предоставленных эпиков handleSearchEpic не возвращает поток. Еще раз проверьте, не пропущено ли заявление о возврате!

person jayphelps    schedule 14.05.2017
comment
Эй, спасибо! Мне очень понравился твой разговор о библиотеке. Превосходный. - person Jose; 14.05.2017
comment
Я думаю, что моя ошибка могла быть ошибкой новичка здесь. Я определенно пытался имитировать неявный возврат, но забыл о скобках. Я думаю, что улучшить сообщение об ошибке можно так же просто, как добавить Double check you're either using a return statement or an es6 implicit return. Может быть, у кого-то еще может быть лучший вклад? - person Jose; 14.05.2017
comment
Почему сообщение об ошибке должно состоять только из одной строки и, как правило, в результате крайне нечетко? Почему ваш ответ не может состоять примерно из 15 строк и показывать, какая наиболее распространенная ошибка вызывает ошибку, и очень полезно показать ваши два разных подхода к ее работе? Сообщения об ошибках еще в средневековье - person user3775501; 15.08.2018