让reduxFirestore在react app.TypeError中工作: getFirestore不是函数/ ts(2345)

npm install redux react-redux firebase reduxFirestore

import { createStore, applyMiddleware, compose } from 'redux';
import { Provider } from 'react-redux';
import { createFirestoreInstance, getFirestore } from 'redux-firestore';
import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase';
import firebase from 'firebase/app';
import 'firebase/firestore'; // 如果您需要使用Firestore数据库

// 创建Firebase配置对象
const firebaseConfig = {
  // 您的Firebase配置
};

// 初始化Firebase
firebase.initializeApp(firebaseConfig);

// 创建Redux store
const store = createStore(
  // 您的根reducer
  // ...
  applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore }))
);

// 创建Redux和Firebase的配置对象
const rrfConfig = {
  userProfile: 'users',
  useFirestoreForProfile: true,
};

// 创建React Redux Firebase提供程序
const rrfProps = {
  firebase,
  config: rrfConfig,
  dispatch: store.dispatch,
  createFirestoreInstance,
};

// 渲染应用程序
ReactDOM.render(
  <Provider store={store}>
    <ReactReduxFirebaseProvider {...rrfProps}>
      <App />
    </ReactReduxFirebaseProvider>
  </Provider>,
  document.getElementById('root')
);

import { compose } from 'redux';
import { connect } from 'react-redux';
import { firestoreConnect } from 'react-redux-firebase';

// 创建组件
const MyComponent = () => {
  // ...
}

// 使用高阶组件连接到Firestore并从state获取数据
export default compose(
  firestoreConnect([{ collection: 'myCollection' }]),
  connect((state) => ({
    myData: state.firestore.data.myCollection,
  }))
)(MyComponent);

import { getFirestore } from 'redux-firestore';

// 在组件中使用getFirestore
const myFunction = () => {
  const firestore = getFirestore();
  // ...
}