这是我的减速机:
export default function reducer(state= [], action) {
switch (action.type) {
case types.ADD_DISH_FULFILLED:
return [...state, Object.assign({}, action.data)];
case types.FETCH_DISHES_FULFILLED:{
return [...state, Object.assign({}, action.data.dishes)];
}
default:
return state;
}
};
继承我的行为:
function requestDishes() {
return {type: types.FETCH_DISHES_PENDING}
};
function receiveDishes(json) {
return{
type: types.FETCH_DISHES_FULFILLED,
data: json
}
};
function receiveDishesError(json) {
return {
type: types.FETCH_DISHES_ERROR,
data: json
}
};
export const fetchDishes = () => {
return function(dispatch) {
dispatch(requestDishes());
return axios.get(restPath+'/dishes')
.then(function(response) {
dispatch(receiveDishes(response.data));
})
.catch(function(response){
dispatch(receiveDishesError(response.data));
})
}
}
function requestDish() {
return {type: types.ADD_DISH_PENDING}
};
function receiveDish(json) {
return{
type: types.ADD_DISH_FULFILLED,
data: json
}
};
function receiveDishError(json) {
return {
type: types.ADD_DISH_ERROR,
data: json
}
};
export const addDish = (dish) => {
return function(dispatch) {
dispatch(requestDish());
return axios.post(restPath+'/dishes', dish)
.then(function(response) {
dispatch(receiveDish(response.data));
})
.catch(function(response){
dispatch(receiveDishError(response.data));
})
}
};
当我调用addDish函数时,一切正常,它就像Api返回时一样附加到道具上{“”:“”,“”:“”,“”,“”}
然而......当我拿回所有的菜肴时,我回来时遇到了问题
[ "Dishes"{
Obj{},
Obj{}
}]
在减速机中,我正在尝试:
return [...state, Object.assign({}, action.data.dishes)];
但这里出现了问题,道具现在是
"Dishes" [
Object{
Object,
Object
}
]
但我希望它是
"Dishes" [
Object,
Object,
Object
]
并没有嵌套到另一个级别。
这是我的容器=
DishContainer.propTypes = {
dishes: PropTypes.array.isRequired,
actions: PropTypes.object.isRequired
};
function mapStateToProps(state, props) {
return {
dishes: state.dishes
};
}
function mapDispatchToProps(dispatch) {
return {
actions: bindActionCreators(dishesActions, dispatch)
}
}
export default connect(mapStateToProps, mapDispatchToProps)(DishContainer);