Object(...) 不是 applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })) 的函数错误

Question

我在我的项目中遇到了一个错误，当我想使用我的 CreateProject 反应组件动态添加数据时，我使用 React/Redux/Firebase 工具创建了它我收到了这个错误：× TypeError: Object(...) is not a function

索引.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)
  )
);

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById("root")
);
serviceWorker.unregister();

projectAction.js

export const createProject = project => {
  return (dispatch, getStore, { getFirebase, getFirestore }) => {
    // make async call to database
    const firestore = getFirestore();
    firestore.collection("projects").add({
      ...project,
      authorFirstName: "MyFirstName",
      authorLastName: "MyLastName",
      authorId: 12345,
      createdAt: new Date()
    }).then(
      () => {
        dispatch({
          type: "CREATE_PROJECT",
          project: project
        });
      }
    ).chatch(
      (err) => {
        dispatch({
          type: "CREATE_PROJECT_ERROR",
          project: err
        })
      }
    )
  };
};

谢谢你的帮助

Answer 1

这可能对您有用：

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 { createFirestoreInstance, getFirestore, reduxFirestore } from 'redux-firestore'
import { ReactReduxFirebaseProvider, getFirebase } from 'react-redux-firebase'
import fbConfig from './config/fbConfig'
import firebase from 'firebase/app'

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

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

ReactDOM.render(
  <Provider store={store}>
      <ReactReduxFirebaseProvider {...rrfProps}>
          <App />
      </ReactReduxFirebaseProvider>
  </Provider>,
  document.getElementById("root")
);

serviceWorker.unregister();

有关更多详细信息，请转到官方文档。