我正在尝试使用redux saga eventChannel使用websocket从第三方api获取实时数据,但由于某些原因,我遇到了如下错误:

javascript - Redux Saga EventChannel:TypeError:(0,_reduxSaga.take)不是函数-LMLPHP



//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
谢谢!

最佳答案

您需要从take导入takeEveryredux-saga/effects。结果如下:

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

...

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

关于javascript - Redux Saga EventChannel:TypeError:(0,_reduxSaga.take)不是函数,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52244012/

10-09 18:38