Попытка подключить Реагировать компонент к моему государству Redux, но я получаю сообщение об ошибке:Uncaught Ошибка: Ожидаемый редуктор быть функцией
Uncaught Error: Expected the reducer to be a function
Не совсем уверен, где я неправильно:
import React from 'react';
import { render } from 'react-dom';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
import { Provider } from 'react-redux';
import { createStore, applyMiddleware } from 'redux';
import ReduxPromise from 'redux-promise';
import store, { history } from './store';
// Import components
import App from './components/App';
import Expenditure from './components/Expenditure';
import Income from './components/Income';
import Transactions from './components/Transactions';
import Single from './components/Single';
// import css
import css from './styles/style.styl';
const createStoreWithMiddleware = applyMiddleware(ReduxPromise)(createStore);
const router = (
<Provider store={createStoreWithMiddleware(store)}>
<Router history={history}>
<Route path="/" component={App}>
<IndexRoute component={Expenditure} />
<Route path="/income" component={Income} />
<Route path="/expenditure" component={Expenditure} />
<Route path="/transactions" component={Transactions} />
<Route path="/expenditure/:id" component={Single} />
<Route path="/income/:id" component={Single} />
<Route path="/transaction/:id" component={Single} />
</Route>
</Router>
</Provider>
);
render(router, document.getElementById('root'));
Мой rootReducer:
import { combineReducers } from 'redux';
import { routerReducer } from 'react-router-redux';
import expenditure from './expenditure';
const rootReducer = combineReducers({
expenditure,
routing: routerReducer
});
export default rootReducer;
И мои actionCreators.js:
import axios from 'axios';
export const FETCH_EXPENDITURE = 'FETCH_EXPENDITURE';
export function fetchExpenditure() {
const request = axios.get('/api/expenditure');
return {
type: FETCH_EXPENDITURE,
payload: request
}
};
Тогда в моем компоненте, я использую подключения тянуть в состоянии Redux в качестве реквизита со следующим ниже расходов реагируют класс:
function mapStateToProps(state) {
console.log('state');
return {
expenditure: state.expenditure.all
};
}
function mapDispatchToProps(dispatch) {
return bindActionCreators(actionCreators, dispatch);
}
export default connect(mapStateToProps, mapDispatchToProps)(Expenditure);
Любые советы будут невероятно :)
Спасибо Фил, но что дает мне ошибку 'Uncaught TypeError: createStoreWithMiddleware не является функцией' –
, потому что это не функция и следующая строка вниз, вы пытаетесь передать ей аргумент в своем провайдере, когда вам просто нужно передать объект 'createStoreWithMiddleware'. – PhilVarg
Не могу решить, что мне нужно сделать:/Спасибо за вашу помощь приятель, я завтра перейду к этому завтра, может быть больше смысла! –