如何計算減速機中所有物品的總價格？

我試圖建立reactjs/Redux的一個購物車的應用程序，這是我的減速器1：如何計算減速機中所有物品的總價格？

const initialState = { 
    items: [], 
    cartOpen:true 
} 

    const Cart = (state = initialState, action) => { 
     switch (action.type) { 
      case 'ADD_TO_CART': 
       return [...state, action.payload] 
      default: 
       return state 
     } 
    } 

    export default Cart;

其他減速器中包含的數據，即項目的應用：

const Data = (state = initialState, action) => { 
    switch (action.type) { 
     case 'GET_DATA_SUCCESS': 
      return Object.assign({}, state, { datas: action.data }); 
     case 'GET_DATA_FAIL': 
      return Object.assign({}, state, { datas: action.data }); 

     default: 
      return state 
    } 
}

當ADD_TO_CART行動已發出我要計算購物車的新總計。我正在尋找一種方法來計算購物車更新時購物車中物品的總價格。

來源

2016-11-14 bier hier

我問你點什麼？我剛接觸'redux'，但初始狀態是一個'object'，但爲什麼玩具會返回'array'呢？ changin類型的reacin是什麼？ –

你可以做這樣的事情。

const initialState = { 
    items: [], 
    cartOpen:true, 
    total:0, 
} 

const Cart = (state = initialState, action) => { 
    switch (action.type) { 
     case 'ADD_TO_CART': 
      let newstate = [...state, action.payload]; 
      let newTotal = 0; 
      newstate.items.forEach(item=>{ 
       newTotal+=item.price; 
      }); 
      newstate.total =newTotal; 
      return newstate ; 
     default: 
      return state 
    } 
} 

export default Cart;

來源

2016-11-14 12:56:14 abhirathore2006

獲得newTotal是NaN？ –

現在工作謝謝 –

如果導致項目變更是GET_DATA_SUCCESS，那麼你可以計算出相同的減速機的總價格，並相應設置一個新的國有資產，所以像動作：

case 'GET_DATA_SUCCESS': 
    let totalPrice = getTotalPrice(action.data); 
    return Object.assign({}, state, { datas: action.data, cartTotal: totalPrice });

（如果價格能更改爲檢索失敗，您需要重新計算價格並將其設置爲兩種情況下的子句。）

如果您不想在此子句中設置兩個狀態部分，則可以將其分解爲兩個減速器，兩者都在（比如說）GET_DATA_SUCCESS上作用，但是設置了狀態的不同部分（一個用於數據，一個用於cartTotal）。

作爲一個完整的選擇，銘記保持國家規範化的偏好;你可能只是離開項目的狀態，並使用其他地方的幫手功能來計算渲染的總價格。如果項目數量相對較少且計算簡單，那麼這可能值得考慮。這是很值得一讀：

http://redux.js.org/docs/recipes/ComputingDerivedData.html

來源

2016-11-14 12:45:06

如何計算減速機中所有物品的總價格？

回答

相關問題