使用redux进行响应时,业务逻辑应该去哪里(动作创建者或简化者)?

时间:2018-12-01 13:26:25

标签: javascript reactjs redux react-redux middleware

此问题可能重复,但不能很好地回答我的问题。所以我决定开始一个新线程。

因此,我正在尝试为电子商务应用程序创建一个简单的篮子组件。...

以下是减速器和操作文件的代码:

actions.js

export const incrementQuantitySuccess = (basketProducts) =>{
    return {
        type: actionTypes.INCREMENT_QUANTITY_SUCCESS,
        basketProducts:basketProducts
    }
}

export const incrementQuantity = (line) => {
    return (dispatch,getState) => {  

       /*LOGIC for increment quantity*/
        const basketProducts = getState().basket.productsInBasket;
        const updatedBasketProducts = basketProducts.map((product) =>{        
            if (product.id === line.id){
                product.quantity += 1;
                product.total = product.quantity * product.price;
            }

            return product;
        });
        /***************/  

        dispatch(incrementQuantitySuccess(updatedBasketProducts));
  }
}

reducer.js

const incrementQuantitySuccess = ( state, action ) => {
    return updateObject(state,{
        productsInBasket:action.basketProducts,
        loading:false
    });
}

const reducer = (state= initialState,action) => {
    switch(action.type){
        case actionTypes.GET_BASKET: return getBasket(state,action);
        case actionTypes.INCREMENT_QUANTITY_SUCCESS: return incrementQuantitySuccess(state,action);
        default:return state;
    }
}

export default reducer;

现在,我已经将增量数量逻辑放在我的action.js文件中。

在分发业务逻辑时,我发现了各种建议,可以在减速器和动作创建者之间保持平衡,正如有些人告诉我们,让减速器愚蠢而愚蠢。

我的问题是增量逻辑应该去哪里?我在redux.js.org上浏览了几篇文章,讨论了业务逻辑应该在哪里,但是我仍然不清楚。

这个特殊用例也是不确定的,我不确定是否需要像redux-logic这样的中间件。

我是新来的反应者。请对此进行指导。

预先感谢

1 个答案:

答案 0 :(得分:1)

其中一种做法是,您应使简化程序和操作保持,并且真正的副作用应该发生在中间件内部。通过这种方法,您将使操作和简化程序保持美观和整洁,并且您可以完全专注于中间件,因为它们将成为唯一可能发生副作用的地方。

当我观看Nir Kaufman的演讲时,我真的很惊讶,我鼓励您在ReactNYC Advanced Redux Patterns - Nir Kaufman @ ReactNYC上观看他的演讲。当我最忙于Redux时,这段视频对我有很大帮助。

还有关于Nir的Redux和中间件的第二种说法。您可以在Advanced Redux: Design Patterns and Practices - Nir Kaufman | JSHeroes 2018

中查看第二个

希望这会有所帮助!