史诗不是功能

时间:2019-04-20 13:49:23

标签: reactjs rxjs redux-observable

每次遇到错误

时,我都会遇到CombineEpics的问题
"TypeError: Object(...) is not a function"

registerUser.js中的一行(这是史诗之一):

export const  registerUser = action$ =>

RootEpic:

import { combineEpics } from 'redux-observable';
import  { registerUser } from './Epics/registerUser';

export default combineEpics(
  registerUser
  );

registerUser史诗:

import 'rxjs';
import {REGISTER_USER} from '../Actions/types';
import {registerUserSuccess,registerUserFailed} from '../Actions/registerAction';
import Axios from 'axios';
import { Observable,from  } from 'rxjs';
import {mergeMap} from 'rxjs/Operator';
import {ofType} from 'redux-observable';



export const  registerUser = action$ =>
    action$.pipe(
    ofType(REGISTER_USER),
    mergeMap(action => 
        from(Axios.post("api/Account",action.payload))
        .map(response  => registerUserSuccess(response))
        .catch(error => Observable.of(registerUserFailed(error)))
  )
);

有人可以向我解释哪里出问题吗?

1 个答案:

答案 0 :(得分:0)

我真的不确定..在我的情况下我用过

export const rootEpic = combineEpics({loginEpic});

应该

export const rootEpic = combineEpics(loginEpic);

如果有帮助,我会提供我的整个解决方案 index.js

import React from "react";
import ReactDOM from "react-dom";
import "./styles/bootstrap.min.css";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import { Provider } from "react-redux";
import { store } from "./setup/store";
ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,
  document.getElementById("root")
);

store.js

import { createStore, applyMiddleware, combineReducers, compose } from "redux";
import { persistStore, persistReducer } from "redux-persist";
import logger from "redux-logger";
import { createEpicMiddleware } from "redux-observable";
import { rootEpic } from "./epics";
import storage from "redux-persist/lib/storage";

const reducer = combineReducers({
  blank: (state = null) => state,
});

const epicMiddleware = createEpicMiddleware();
const persistConfig = {
  key: "root",
  storage: storage,
  blacklist: [],
};

const persistedReducer = persistReducer(persistConfig, reducer);
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const middleware = [];
const enhancers = [];
middleware.push(epicMiddleware);
middleware.push(logger);
enhancers.push(applyMiddleware(...middleware));

const store = createStore(persistedReducer, composeEnhancers(...enhancers));
const persistor = persistStore(store);
epicMiddleware.run(rootEpic);
export { store, persistor };

epics.js

import { combineEpics } from "redux-observable";
import { loginEpic } from "../screens/Login";
export const rootEpic = combineEpics(loginEpic);

登录/Epic.js

export const loginEpic = (action$) =>
  action$.pipe(
    ofType(LOGIN_FETCHING_DATA_ATTEMPT),
    flatMap(async (action) => {
      try {
        const response = await myAPI.login(action.payload);
        return { payload: response };
      } catch (e) {
        return false;
      }
    }),
    map((action) => {
      if (action.payload) {
        navigate({ url: "/" });
        return {
          type: LOGIN_FETCHING_DATA_SUCCESS,
          payload: action.payload,
          token: action.payload.token,
        };
      } else {
        return {
          type: LOGIN_FETCHING_DATA_FAILURE,
        };
      }
    })
  );