将firebase作为参数添加到thunk时，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
}

您是否知道会发生什么？我很绝望。

非常感谢您。

Answer 1

如果您提到“ redux-firestore”和“ react-redux-firebase”版本，那就太好了。

react-redux v6最近进行了迁移： http://react-redux-firebase.com/docs/v3-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已删除。 还要如下更改composedEnhancers：

- 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，以防万一它仍然无法正常工作。