object is not a function when calling `useFirestoreConnect`

问题

I'm using react-redux-firebase and redux-firestore packages. I'm trying to connect firestore to redux using the useFirestoreConnect hook, but after calling this hook it gives me a TypeError like in this picture. I've searched in the GitHub issues, docs and here but I'vent fount any solution.

The error: Uncaught (in promise) TypeError: Object(...) is not a function

you see the whole error in this picture:

The console.log error

The TypeError returned

回答1:

Hello guys I figure out where the problem coming from. This is for anyone who is looking for a solution.

react-redux-firebase and redux-firestore are having some issues in versions compatibility, so to skip that I installed the latest version of the packages!

Clearly there were some differences between old versions and the new ones of giving your app the redux firebase provider. The old way might look like this:

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

but if you want to implement hooks in your app and use the useFirestoreConnect this will not work. In new versions you need to remove the reactReduxFirebase and reduxFirestore from your createStore func and instead use the ReactReduxFirebaseProvider imported from react-redux-firebase and wrap your app inside it, like this:

<ReduxProvider store={store}>
   <ReactReduxFirebaseProvider {...rrfProps}>
     <BrowserRouter>
       <AuthIsLoaded>
         <App />
       </AuthIsLoaded>
     </BrowserRouter>
   </ReactReduxFirebaseProvider>
</ReduxProvider>

and passed props: firebase, react-redux-firebase config and any other things you wan. the rrfProps are lik this:

const rrfProps = {
firebase,
config: rrfConfig,
dispatch: store.dispatch,
createFirestoreInstance, //since we are using Firestore
};

and this is the react-redux-firebase config (rrfConfig):

const rrfConfig = {
  userProfile: "users",
  useFirestoreForProfile: true, // Firestore for Profile instead of Realtime DB
  attachAuthIsReady: true, // attaches auth is ready promise to store
};

来源：https://stackoverflow.com/questions/62451289/object-is-not-a-function-when-calling-usefirestoreconnect

标签

reactjs

firebase

redux

google-cloud-firestore

react-redux-firebase