Ошибка типа: firestore.collection не является функцией (React / Redux / Firestore)

Question

Проблема довольно проста - когда я пытаюсь выполнить действие с помощью Firestore / React / Redux, я получаю эту ошибку - TypeError: firestore.collection is not a function - в следующей строке кода -

export const addObject = (object) => {
    return (dispatch, getState, {getFirestore}) => {
    const firestore = getFirestore();
    const authorId = getState().firebase.auth.uid;

    firestore.collection('objects').add({ <==== THIS LINE
        ...object
    }).then(() => {
        dispatch({ type: 'ADD_OBJECT_SUCCESS' });
    }).catch(err => {
        dispatch({ type: 'ADD_OBJECT_ERROR' }, err);
    });
  }
};

После проверки я обнаружил, что у firestore действительно нет функции, называемой collection. Это не имеет смысла, потому что каждый найденный мною ресурс делает это таким образом, и обычно Firestore имеет коллекцию как функцию (я использовал ее раньше без избыточности). Вот мой код ниже:

objectReducer. js

const initState = {}

const projectReducer = (state = initState, action) => {
    switch (action.type) {
        case 'CREATE_OBJECT_SUCCESS':
            console.log('create object success');
            return state;
        case 'CREATE_OBJECT_ERROR':
            console.log('create object error');
            return state;
        default:
            return state;
    }
};

export default projectReducer;

Приложение. js

const fbConfig = {
    // Configuration
}

const rrfConfig = {
    userProfile: 'users',
    useFirestoreForProfile: true,
    attachAuthIsReady: true
}

firebase.initializeApp(fbConfig)
firebase.firestore()

const rootReducer = combineReducers({
    auth: authReducer,  
    users: objectReducer,
    firebase: firebaseReducer,
    firestore: firestoreReducer
})

// Create store with reducers and initial state
const initialState = {}
const store = createStore(
    rootReducer, 
    initialState, 
    compose (
        applyMiddleware(thunk.withExtraArgument({getFirebase, getFirestore})),
        reduxFirestore(fbConfig)
    )
)

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

function AuthIsLoaded({ children }) {
    const auth = useSelector(state => state.firebase.auth)
    if (!isLoaded(auth)) return <div>Loading, please wait...</div>;
    return children
}

function App() {
    return (
        <Provider store={store}>
            <ReactReduxFirebaseProvider {...rrfProps}>
                ...
            </ReactReduxFirebaseProvider>
        </Provider>
    );
}

Я пропустил весь импорт и другие ненужные файлы / код. Однако, если кому-то понадобится дополнительная информация, я буду рад ее предоставить. Заранее спасибо!

Answer 1

index. js

import { createStore, applyMiddleware, compose } from 'redux';
import rootReducer from './store/reducers/rootReducer';
import { Provider } from 'react-redux';
import thunk from 'redux-thunk';
import fbConfig from './config/fbConfig';
import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase';
import { reduxFirestore, getFirestore, createFirestoreInstance } from 'redux-firestore';
import firebase from 'firebase/app';

import { useSelector } from 'react-redux';
import { isLoaded } from 'react-redux-firebase';

const store = createStore(
  rootReducer,
  compose(
    applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
    reduxFirestore(fbConfig, /* ***!NOTE =>*** */ firebase)
  )
);

const rrfConfig = {
  userProfile: 'users',
  useFirestoreForProfile: true,
};

const rrfProps = {
  firebase,
  config: rrfConfig,
  dispatch: store.dispatch,
  createFirestoreInstance,
};

firebaseConfig. js

import firebase from 'firebase/app';
import 'firebase/firestore';
import 'firebase/auth';

const firebaseConfig = {
  apiKey: '*',
  authDomain: '*',
  databaseURL: '*',
  projectId: '*',
  storageBucket: '*',
  messagingSenderId: '*',
  appId: '*',
  measurementId: '*'
};

firebase.initializeApp(firebaseConfig);
firebase.firestore()

export default firebase;

Этот код сработал для меня. Думаю, ваша проблема в том, что вы не передали саму базу данных огня the reduxFirestore

reduxFirestore(fbConfig, firebase)

Попробуйте это, это должно работать