当向thunk添加firebase作为参数时，Object(...)不是一个函数。

Question

用redux配置firebase对我来说很麻烦。

我不知道哪里出了问题，但我觉得很困。我试图通过 getFirebase 和 getFirestore 作为参数的 thunk 但我遇到了这个错误。

我在尝试添加额外参数到thunk之前就已经成功了。我使用的是下面的代码。

import { createStore, applyMiddleware, compose } from 'redux'
import thunk from 'redux-thunk'
import { composeWithDevTools } from 'redux-devtools-extension'
import rootReducer from './modules'
import {reduxFirestore, getFirestore} from 'redux-firestore'
import {reactReduxFirebase, getFirebase} from 'react-redux-firebase'
import fbConfig from './firebase/config'

export function initializeStore(initialState) {
  const _thunk = thunk.withExtraArgument({ getFirebase, getFirestore })

  const middlewareEnhancer = applyMiddleware(_thunk)

  const composedEnhancers = compose(
    middlewareEnhancer,
    reduxFirestore(fbConfig),
    reactReduxFirebase(fbConfig)
  )

  const store = createStore(rootReducer, initialState, composedEnhancers)

  return store
}

你知道这是怎么回事吗? Do you have any idea of what could be happening? 我很绝望。

非常感谢你的帮助。

Answer 1

如果你能提到'redux-firestore'和'react-redux-firebase'的版本，那就太好了。

最近有一个react-redux v6的迁移。http:/react-redux-firebase.comdocsv3-migration-guide.html

你可能需要在你的代码中做的改动。

- import { reactReduxFirebase, getFirebase } from 'react-redux-firebase'
+ import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase'

- import { reduxFirestore, getFirestore } from 'redux-firestore'
+ import { createFirestoreInstance, reduxFirestore, getFirestore } from 'redux-firestore'

+ import firebase from "firebase/app";

当你有react-redux-firebase的最新版本时，就会用到这个，因为reactReduxFirebase的API已经被移除。同时修改compositionEnhancers如下。

- const composedEnhancers = compose(
-    middlewareEnhancer,
-    reduxFirestore(fbConfig),
-    reactReduxFirebase(fbConfig)
-   )

+  const composedEnhancers = compose(
+     middlewareEnhancer,
+     reduxFirestore(firebase, fbConfig)
+  )

添加react-redux-firebase道具

+ const rrfProps = {
+   firebase,
+   config: fbConfig,
+   dispatch: store.dispatch, 
+   createFirestoreInstance,
+ }

而且你需要为你的应用提供react-redux-firebase道具。

<ReactReduxFirebaseProvider {...rrfProps}>
        <App />
</ReactReduxFirebaseProvider>

它应该可以正常工作。你可以按照上面的链接添加rrfConfig，如果还是不行的话。