首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

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

要让reduxFirestore在React应用中正常工作并解决TypeError: getFirestore is not a function/ ts(2345)错误,您需要进行以下操作:

  1. 首先,确保您的应用程序已正确安装和配置reduxFirestore和相关依赖项。您可以使用以下命令安装所需的包:
代码语言:txt
复制
npm install redux react-redux firebase reduxFirestore
  1. 确保您已经正确设置了Firebase配置,并且您的应用程序可以连接到Firebase数据库。您可以参考Firebase文档来配置和初始化Firebase。
  2. 确保您已经正确设置了Redux和reduxFirestore。在您的应用程序的入口文件中,您需要进行以下配置:
代码语言:txt
复制
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')
);
  1. 确保您正确使用了react-redux-firebase提供的高阶组件。例如,在使用firestoreConnect高阶组件获取数据时,您需要使用compose函数和connect函数将它们组合在一起。例如:
代码语言:txt
复制
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);
  1. 确保您正确导入和使用getFirestore函数。在您的组件中,您可以按如下方式使用它:
代码语言:txt
复制
import { getFirestore } from 'redux-firestore';

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

通过以上步骤,您应该能够让reduxFirestore在React应用中正常工作,并解决TypeError: getFirestore is not a function/ ts(2345)错误。请注意,这只是一个示例答案,具体的实现可能因应用程序的不同而有所不同。希望对您有所帮助!

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券