redux報(bào)錯(cuò)：Error: Expected the reducer to be a function.

我特意在store.js中打印了typeof rootReducer，打印結(jié)果是函數(shù)，但是為什么卻報(bào)了這個(gè)錯(cuò)？

我的store.js：

import { createStore } from 'redux'
import rootReducer from './reducer';
const initialState = {};
console.log(typeof rootReducer)
const store = createStore(
    rootReducer,
    initialState,
    window.devToolsExtension ? window.devToolsExtension : f=>f
);

export default store

我的reducer.js：

import { combineReducers } from 'redux';
import { music } from './redux/player.redux';
const rootReducer = combineReducers({
    music
});
export default rootReducer

我的app.js:

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import store from './store'
import Router from './router'
class App extends Component {
  render() {
    const store = store();
    return (
      <Provider store={store}>
          <div className="App">
            <Router></Router>
          </div>
      </Provider>
    );
  }
}

export default App;

回答

編輯回答

莫小染

解決了，window.devToolsExtension ? window.devToolsExtension() : f=>f,差了個(gè)括號(hào)。。。

2017年7月22日 04:36

編輯回答

熟稔

謝邀！
首先恭喜您已經(jīng)解決了該問(wèn)題！白天忙于nextjs + react + 。。。重構(gòu)項(xiàng)目，沒(méi)來(lái)得及看！真是抱歉！該問(wèn)題其實(shí)我們看一下createStore的源碼就知道了！

/**
 * createStore
 * @param {reducer} reducer為function,當(dāng)dispatch一個(gè)action時(shí)，此函數(shù)接收action來(lái)更新state
 * @param {preloadState} 初始化State
 * @param {enhancer} enhancer 為function。用來(lái)增強(qiáng)store
 * @return {Object} 返回一個(gè)包含dispatch和subscribe等函數(shù)的對(duì)象
 */

export default function createStore(reducer, preloadedState, enhancer) {
    if (typeof preloadedState === 'function' && typeof enhancer === 'undefined') {
        // 如果只傳了兩個(gè)參數(shù)，且第二個(gè)參數(shù)為函數(shù)，第二個(gè)參數(shù)則被當(dāng)作enhancer
        enhancer = preloadedState
        preloadedState = undefined
    }
  
    if (typeof enhancer !== 'undefined') {
        if (typeof enhancer !== 'function') {
            // 校驗(yàn)enhancer是否為函數(shù)，如果不是函數(shù)則拋出異常
            throw new Error('Expected the enhancer to be a function.')
        }
        // 如果enhancer存在且為函數(shù)，那么則返回如下調(diào)用
        return enhancer(createStore)(reducer, preloadedState)
    }

    if (typeof reducer !== 'function') {
        //校驗(yàn)reducer是否為函數(shù)
        throw new Error('Expected the reducer to be a function.')
    }
    
    // 省略其他源碼部分
    
}

2018年8月31日 16:22