我收到了TypeError:中间件不是函数。有一些类似的问题和答案在我的案例中似乎并不适用。我打算制作一个axios /异步请求。这是我的index.js文件的实现:
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import { Provider } from 'react-redux';
import { createStore, combineReducers, applyMiddleware } from 'redux';
import axios from 'axios';
import thunk from 'redux-thunk';
import logger from 'redux-logger';
const PATH_BASE = 'https://itunes.apple.com/search';
const PATH_TERM = 'term=';
const COUNTRY = 'country=es';
const ALBUMS = 'entity=album';
const LIMIT = 'limit=60';
const booleanReducer = (state = { grid:true, additionalPages:false }, action) => {
if (action.type === 'GRID'){
return state = {
...state,
grid:!state.grid
}
}
if (action.type === 'ADDITIONALPAGES'){
return state = {
...state,
additionalPages:!state.additionalPages
}
}
return state;
};
const searchItunesReducer = (state = { searchTerm:'', itunes:null }, action) => {
if (action.type === 'SEARCHTERM'){
return state = {
...state,
searchTerm:action.payload
}
}
if (action.type === 'FETCHITUNESALBUMS'){
return state = {
...state,
}
}
return state;
}
const middleware = applyMiddleware(thunk, logger());
const store = createStore(combineReducers({booleanReducer,searchItunesReducer}),middleware);
console.log(store.getState());
store.subscribe(() =>{
console.log("store updated!", store.getState());
});
registerServiceWorker();
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>
, document.getElementById('root'));
如果我删除行const middleware = applyMiddleware(thunk, logger());
和const middleware
const store
该应用加载但没有问题。我在这里做错了什么?
答案 0 :(得分:0)
React / Redux教程中的这段代码也存在相同的问题:
不为我工作:
import { applyMiddleware, createStore } from "redux";
import thunk from "redux-thunk";
import promise from "redux-promise-middleware";
import { composeWithDevTools } from 'redux-devtools-extension';
import rootReducer from "./reducers";
const middleware = composeWithDevTools(applyMiddleware(promise(), thunk));
export default createStore(rootReducer, middleware);
我的解决方案: 因为createStore()函数正在请求一个函数,所以我创建了一个。由于某些原因(或我没有正确执行)而无法接受箭头功能。我也修改了promise()函数调用,只声明了一个参数。这使我经历了编译。
import { applyMiddleware, createStore } from "redux";
import thunk from "redux-thunk";
import promise from "redux-promise-middleware";
import { composeWithDevTools } from 'redux-devtools-extension';
import rootReducer from "./reducers";
function middleware() {
return composeWithDevTools(applyMiddleware(promise, thunk));
}
export default createStore(rootReducer, middleware());