firebase - TypeError: Object(...) 不是 index.js 上的函数
问题描述
嗨,当我在浏览器中运行代码时出现此错误:
TypeError: Object(...) is not a function ./src/index.js src/index.js:31
28 | firebaseStateName: 'firebase' 29 | } 30 | 常量初始状态 = {};
31 | const store = createStore(rootReducer,initialState, 32 | compose( 33 | applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })), 34 | reactReduxFirebase(firebase, config),
我尝试使用事物库:
http://docs.react-redux-firebase.com/history/v3.0.0/docs/integrations/thunks.html
但是仍然没有成功:/
在我的 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 { createFirestoreInstance, reduxFirestore, getFirestore } from 'redux-firestore';
import { ReactReduxFirebaseProvider, reactReduxFirebase, getFirebase } from 'react-redux-firebase';
import fbConfig from './config/fbconfig'
import firebase from 'firebase/app'
import 'firebase/firestore'
import 'firebase/auth'
import 'firebase/storage'
import 'firebase/functions'
firebase.initializeApp(fbConfig);
firebase.firestore();
firebase.storage().ref();
firebase.functions();
const config = {
useFirestoreForProfile:true,
userProfile: 'Klanten',
userFirestoreForProfile: true,
attachAuthIsReady: true,
firebaseStateName: 'firebase'
}
const initialState = {};
const store = createStore(rootReducer,initialState,
compose(
applyMiddleware(thunk.withExtraArgument({ getFirebase, getFirestore })),
reactReduxFirebase(firebase, config),
reduxFirestore(firebase)
)
)
store.firebaseAuthIsReady.then(() => {
const rrfProps = {
firebase,
config: fbConfig,
dispatch: store.dispatch,
createFirestoreInstance
}
ReactDOM.render(<Provider store={store}><ReactReduxFirebaseProvider {...rrfProps}><App /></ReactReduxFirebaseProvider></Provider>, document.getElementById('root'));
serviceWorker.unregister();
})
这是我的 rootReducer.js
import authReducer from './authReducer'
import shopReducer from './shopReducer'
import { combineReducers } from 'redux'
import { firebaseReducer } from 'react-redux-firebase'
import { firestoreReducer } from 'redux-firestore'
const rootReducer = combineReducers({
firebase: firebaseReducer,
firestore: firestoreReducer,
auth: authReducer,
shop: shopReducer
})
export default rootReducer
解决方案
这是您的问题所在:
reactReduxFirebase(firebase, config),
reduxFirestore(firebase)
最新版本的配置略有变化,如果您使用的是 React V6,则必须使用该配置。
*确保通过键入以下内容安装最新版本:
npm i --save react-redux-firebase@next
http://docs.react-redux-firebase.com/history/v3.0.0/docs/v3-migration-guide.html
+ import { ReactReduxFirebaseProvider } from 'react-redux-firebase'
+ import { createFirestoreInstance } from 'redux-firestore'
- import { reactReduxFirebase } from 'react-redux-firebase' // removed
- import { reduxFirestore } from 'redux-firestore' // removed
const store = createStore(
rootReducer,
initialState,
compose(
- reactReduxFirebase(firebase, rrfConfig), // removed
- reduxFirestore(firebase)
// applyMiddleware(...middleware) // removed
)
)
+ const rrfProps = {
+ firebase,
+ config: rrfConfig,
+ dispatch: store.dispatch,
+ createFirestoreInstance // <- needed if using firestore
+ }
const App = () => (
<Provider store={store}>
+ <ReactReduxFirebaseProvider {...rrfProps}>
<Todos />
+ </ReactReduxFirebaseProvider>
</Provider>
);
推荐阅读
- typescript - 在初始化期间返回给 vuex 插件的 vuex 商店的正确类型是什么
- crystal-lang - 使用 HTTP::Client.get("https...") 关闭流(IO::Error)
- jquery - 翻译 jquery 表
- javascript - 如何让引导 datetimepicker 只选择时间
- git - git cherry-pick 奇怪的问题,有时会发生冲突,但有时不会
- loops - 真的很基础的东西!使用 for 循环或 while 函数设计选择最少礼物数量的计划
- c# - 从 WPF 应用程序使用默认电子邮件客户端发送电子邮件
- android - AsyncTask onPostExecute 在 JSONObject 之后停止执行
- kubernetes - Kubernetes 节点重启后 Cassandra pod 失败
- c# - .Net core web api 在调用 Startup 之前配置服务