TypeError:getfirebase不是函数

时间:2019-06-01 15:31:30

标签: reactjs firebase redux react-redux-firebase

绕过Firebase身份验证,但它不断抛出该错误,“ TypeError:getfirebase不是一个函数” typeError消息并中断了应用程序。如果我做错了,请看看我的商店和authReducer。 在我的商店中,我为reduxfirestore提供了getfirestore,还为getuxbase提供了对react-redux-firebase的响应。 我正在使用v2的react-redux-firebase ** TypeError

** store.js

import rrfConfig from "../config/rrfConfig";
import { reduxFirestore, getFirestore } from "redux-firestore";
import { reactReduxFirebase, getFirebase } from "react-redux-firebase";
import { createStore, compose, applyMiddleware } from "redux";
import rootReducer from "./reducers/rootReducer";
import firebase from "firebase/app";
import "firebase/firestore";
import "firebase/auth";
import firebaseConfig from "../config/fbConfig";
import thunk from "redux-thunk";
firebase.initializeApp(firebaseConfig);
firebase.firestore();

const initialState = {};

const store = createStore(
  rootReducer,
  initialState,
  compose(
    applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
    reactReduxFirebase(firebase, rrfConfig),
    reduxFirestore(firebase)
  )
);

export default store;

** authActions.js

  return (dispatch, getState, { getfirebase }) => {
    const firebase = getfirebase();
    firebase
      .auth()
      .signInWithEmailAndPassword(credentials.email, credentials.password)
      .then(() => {
        dispatch({ type: "LOGIN_SUCCESS" });
      })
      .catch(err => {
        dispatch({ type: "LOGIN_ERROR", err });
      });
  };
};

** authReducer

  authError: null
};

const authReducer = (state = initialState, action) => {
  switch (action.type) {
    case "LOGIN_ERROR":
      console.log("login error");
      return {
        ...state,
        authError: "login failed"
      };
    case "LOGIN_SUCCESS":
      console.log("login success");
      return {
        ...state,
        authError: null
      };
    default:
      return state;
  }
};

export default authReducer;

** rootReducer

import authReducer from "./authReducer";
import projectReducer from "./projectReducer";
import { firestoreReducer } from "redux-firestore";
import { firebaseReducer } from "react-redux-firebase";

const rootReducer = combineReducers({
  auth: authReducer,
  project: projectReducer,
  firestore: firestoreReducer,
  firebase: firebaseReducer
});

export default rootReducer;

package.json

  "name": "ghandhi-land",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "firebase": "^6.0.4",
    "materialize-css": "^1.0.0-rc.2",
    "node-sass": "^4.11.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-redux": "^5.1.1",
    "react-redux-firebase": "^2.2.4",
    "react-router-dom": "^5.0.0",
    "react-scripts": "3.0.1",
    "redux": "^4.0.1",
    "redux-firestore": "^0.8.0",
    "redux-thunk": "^2.3.0"
  }
  }
}```

1 个答案:

答案 0 :(得分:0)

在编写redux中间件时,您将通过以下语句应用thunk中间件:

applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore }))

作为额外参数传递的方法的名称用驼峰表示法表示:getFirebasegetFirestore

但是,当您尝试在 authActions.js 中检索额外的参数时,会将其分解为getfirebase

return (dispatch, getState, { getfirebase })

您应该使用相同的符号来破坏对象(在驼峰中)。因此,您的代码应为:

return (dispatch, getState, { getFirebase })