Redux Saga EventChannel：TypeError：（0，_reduxSaga.take）不是函数

Question

我正在尝试使用websx使用redux saga eventChannel从第三方api获取实时数据但由于某种原因我收到如下错误：

//sagas/index.js
import { takeLatest } from "redux-saga";
import { all, fork } from "redux-saga/lib/effects";

import { watchHistoricalPricesSaga } from "./HistoricalPricesSaga";
import { watchLivePricesSaga } from "./LivePricesSaga";

export default function* watcherSaga() {
  yield all([fork(watchHistoricalPricesSaga), fork(watchLivePricesSaga)]);
}

//sagas/LivePricesSaga
import { eventChannel, takeEvery, take } from "redux-saga";
import { call, put } from "redux-saga/lib/effects";

function initWebsocket() {
  return eventChannel(emitter => {
    //Subscription Data
    const subscribe = {
      type: "subscribe",
      channels: [
        {
          name: "ticker",
          product_ids: ["BTC-USD"]
        }
      ]
    };

    //Subscribe to websocket
    let ws = new WebSocket("wss://ws-feed.pro.coinbase.com");

    ws.onopen = () => {
      console.log("Opening Websocket");
      ws.send(JSON.stringify(subscribe));
    };

    ws.onerror = error => {
      console.log("ERROR: ", error);
      console.dir(error);
    };

    ws.onmessage = e => {
      let value = null;
      try {
        value = JSON.parse(e.data);
      } catch (e) {
        console.error(`Error Parsing Data: ${e.data}`);
      }
      if (value && value.type === "ticker") {
        console.log("Live Price: ", value);
        return emitter({
          type: "POST_LIVE_PRICE_DATA",
          data: value.price
        });
      }
    };

    return () => {
      ws.close();
    };
  });
}

function* wsSaga() {
  const channel = yield call(initWebsocket);
  while (true) {
    const action = yield take(channel);
    yield put(action);
  }
}

export function* watchLivePricesSaga() {
  yield takeEvery("START_LIVE_PRICE_APP", wsSaga);
}

//sagas/HistoricalPricesSaga.js
import { takeEvery } from "redux-saga";
import { call, put } from "redux-saga/lib/effects";

import Api from "../api";

function* getHistoricalPrices() {
  console.log("getHistricalPrices");
  try {
    const response = yield call(Api.callHistoricalPricesApi);

    yield put({
      type: "HISTORICAL_PRICES_CALL_SUCCESS",
      historicalPrices: response.data
    });
  } catch (error) {
    yield put({ type: "HISTORICAL_PRICES_CALL_FAILED" });
  }
}

export function* watchHistoricalPricesSaga() {
  yield takeEvery("GET_HISTORICAL_PRICES", getHistoricalPrices);
}

我试图通过分别放置这两个文件来隔离问题，并且HistoricalPricesSaga运行正常。所以，问题似乎与livePricesSaga有关。此外，正在调度该操作，因为我可以使用redux-logger在控制台中看到它。

您还可以在这里查看完整的代码：CodeSandbox谢谢！

Answer 1

你需要从take导入takeEvery和redux-saga/effects。这将导致以下结果：

//sagas/index.js
import { all, fork, takeLatest } from "redux-saga/effects";

...

//sagas/LivePricesSaga
import { call, put, takeEvery, take } from "redux-saga/effects";