9

我正在尝试在 React 中创建一个项目，并且我正在使用 Firebase。在我的 react-redux-firebase 项目中，一行代码出错，但我无法解决。我该如何解决这个“TypeError: Object(...) is not a function”

我已经搜索过这个问题，但无法解决问题。

我正在关注反应版本为 16.4.1 的教程。我不确定这是不是问题

index.js 文件

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { createStore, applyMiddleware, compose } from "redux";
import rootReducer from "./store/reducers/rootReducer";
import { Provider } from "react-redux";
import thunk from "redux-thunk";
import { reduxFirestore, getFirestore } from "redux-firestore";
import { reactReduxFirebase, getFirebase } from "react-redux-firebase";
import fbConfig from "./config/fbConfig";

const store = createStore(
  rootReducer,
  compose(
    applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
    reduxFirestore(fbConfig),
    reactReduxFirebase(fbConfig)
  )
);

如果我注释掉 reatReduxFirebase() 那么它工作正常但我需要这个工作

你可以在这里找到所有代码：https ://github.com/martuza-shimul/React-Blog-app

我每次都收到这个错误：

TypeError: Object(...) is not a function
Module../src/index.js
i:/Learning new things/react/pma/src/index.js:17
  14 | const store = createStore(
  15 |   rootReducer,
  16 |   compose(
> 17 |     applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
  18 |     reduxFirestore(fbConfig),
  19 |     reactReduxFirebase(fbConfig)
  20 |

我不知道如何解决这个问题。一点帮助/提示真的很感激。

4

4 回答 4

14

请使用这个 npm 包
npm 包兼容性问题

npm i --save react-redux@5.1.1 react-redux-firebase@2.2.4
于 2019-11-05T12:58:00.447 回答
5

这是一个 react-redux-firebase v2.xx 编码模式，你可能已经安装了 v3.xx。

  1. 检查您使用的是哪个版本的 react-redux-firebase：
    npm ls react-redux-firebase
  1. 如果版本是 3.0.0 或更高版本，您需要将代码迁移到新的编码模式。有关详细说明，请参阅React-Redux-Firebase v3.xx 迁移指南。
于 2019-12-30T01:40:54.203 回答
2

reactReduxFirebase 存储增强器在 v3 及更高版本中被删除。您现在可以使用上下文提供程序创建 firebase 实例。现在可以这样做：

const store = createStore(
  rootReducer,
  compose(
   applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
   reduxFirestore(fbConfig)
 )
);

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

const App = () => (
  <Provider store={store}>
    <ReactReduxFirebaseProvider {...rrfProps}>
      <Todo />      // your Component
    </ReactReduxFirebaseProvider>
  </Provider>
 );

到目前为止，“reduxFirestore”工作正常，所以我想保持原样，但我认为未来几天也会发生同样的情况。因此，省略 compose 和 reduxFirestore(fbConfig) 而是使用：

import { createFirestoreInstance } from 'redux-firestore'

并将 createFirestoreInstance 添加到 rrfProps 如下：

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

欲了解更多信息结帐：http ://react-redux-firebase.com/docs/v3-migration-guide.html#remove-createFirebaseConnect-and-createFirestoreConnect

于 2020-04-12T09:06:36.307 回答
0

选项 01- 调整 npm 包版本react-redux & react-redux-firebase

npm install react-redux@5.1.1 react-redux-firebase@2.2.4

选项 02- 参考 v3 ( http://react-redux-firebase.com/docs/v3-migration-guide.html )

于 2020-04-19T16:32:41.883 回答