我开始学习React + Redux,我正在做一个简单的应用程序,用于添加或删除购物篮中的电影。
但是我在减速器上有问题。我尝试很多事情都没有结果...
预先感谢:)
这是我的代码:
减速器:
import '../actions/actionsTypes';
import { movies } from '../components/movie/data.json';
let initialState = []
movies.map((movie) => {
initialState.push({
id : movie.id,
title: movie.title,
year: year.title,
isAdd: false,
isRemove: false
})
return movie
})
const establishment = (state = {}, action) => {
switch (action.type) {
case ADD :
if (state.id !== action.data.id)
return state
return (
...state,
isAdd : !state.isAdd
)
case REMOVE :
if (state.id !== action.data.id)
return state
return (
...state,
isRemove : !state.isRemove
)
default:
return state
}
}
const establishmentsReducer = (state = initialState, action) => {
switch (action.type) {
case ADD :
return state.map(movieState =>
movie(movieState, action)
)
case REMOVE :
return state.map(movieState =>
movie(movieState, action)
)
default:
return state
}
}
export default movieReducer;
reducer的连接(我知道它不是没有用的,但是将来必须结合使用reducer):
import { combineReducers } from 'redux';
import movieReducer from './movieReducer';
const allReducers = combineReducers({
movie : movieReducer
})
export default allReducers;
index.js:
import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import allReducers from './reducers';
import './index.css';
import App from './components/App';
import * as serviceWorker from './serviceWorker';
const store = createStore(allReducers);
ReactDOM.render(
<Provider store={ store }>
<App/>
</Provider>,
document.getElementById('root')
)
答案 0 :(得分:1)
在减速器中,更改:
export default movieReducer;
收件人:
export default establishmentsReducer;
这是因为您需要导出实际定义的函数或变量,在这种情况下为establishmentsReducer
。您在化简文件中共享的代码没有定义/命名为movieReducer
的任何函数/变量/表达式。
另一种选择是将const establishmentsReducer = (state = initialState, action) => {
更改为const movieReducer = (state = initialState, action) => {
。
希望有帮助!
答案 1 :(得分:1)
您已正确导入:
导入减速器,如:
从“ ./reducers”导入{allReducers};
这将解决您的问题。