Javascript TypeError:firestore.collection不是函数(React/Redux/firestore)
问题很简单-当我尝试使用Firestore/React/Redux执行操作时,在下面的代码行中出现了以下错误-Javascript TypeError:firestore.collection不是函数(React/Redux/firestore),javascript,reactjs,firebase,google-cloud-firestore,react-redux,Javascript,Reactjs,Firebase,Google Cloud Firestore,React Redux,问题很简单-当我尝试使用Firestore/React/Redux执行操作时,在下面的代码行中出现了以下错误-TypeError:Firestore.collection不是函数- export const addObject = (object) => { return (dispatch, getState, {getFirestore}) => { const firestore = getFirestore(); const authorId = ge
TypeError:Firestore.collection不是函数-
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);
});
}
};
App.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;
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>
);
}
const fbConfig={
//配置
}
常数rrfConfig={
userProfile:'用户',
useFirestoreForProfile:true,
真的吗
}
firebase.initializeApp(fbConfig)
firebase.firestore()
const rootReducer=combinereducer({
auth:auth,
用户:objectReducer,
firebase:firebaseReducer,
firestore:firestoreReducer
})
//使用还原器和初始状态创建存储
常量initialState={}
const store=createStore(
减根剂,
初始状态,
谱写(
applyMiddleware(thunk.withExtraArgument({getFirebase,getFirestore})),
reduxFirestore(fbConfig)
)
)
常数rrfProps={
火基,
配置:rrfConfig,
调度:store.dispatch,
createFirestoreInstance
}
函数authisload({children}){
const auth=useSelector(state=>state.firebase.auth)
如果(!isLoaded(auth))返回加载,请稍候。。。;
返回儿童
}
函数App(){
返回(
...
);
}
我遗漏了所有导入和其他不必要的文件/代码。不过,如果有人需要更多信息,我很乐意提供。提前谢谢你 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;
这个代码对我有用
我想你的问题是你没有把firebase本身交给reduxFirestore
reduxFirestore(fbConfig, firebase)
试试这个,这个应该可以用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;
这个代码对我有用
我想你的问题是你没有把firebase本身交给reduxFirestore
reduxFirestore(fbConfig, firebase)
试试这一个,这应该行得通(我不熟悉react)你在哪里定义getFirestore()
?(我不熟悉react)你在哪里定义getFirestore()
?