web-dev-qa-db-ja.com

「TypeError:Object(...)は関数ではありません」react-redux-firebase

Reactでプロジェクトを作成しようとしています。Firebaseを使用しています。react-redux-firebaseプロジェクトでは、1行のコードでエラーが発生しましたが、修正できませんでした。方法この「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 |  

これを修正する方法がわかりません。ほんの少しのヘルプ/ヒントは本当にありがたいです。

7
Martuza Shimul

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'

以下のようにrrfPropsにcreateFirestoreInstanceを追加します。

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

詳細については、チェックアウト: http://react-redux-firebase.com/docs/v3-migration-guide.html#remove-createFirebaseConnect-and-createFirestoreConnect

0
Ashish Bastola