javascript - 如何管理redux状态对象？

Question

这是响应数据。使用按增量和减量时，我需要存储每个项目的数量。

{name: "McChicken", type: "Non-Veg", price: 275, tax: 10}
{name: "Pizza", type: "Non-Veg", price: 275, tax: 10}
{name: "Burger", type: "Non-Veg", price: 275, tax: 10}

Redux 状态:在基于对象的存储中保存状态

因此很容易根据 key 进行更新。

import * as types from '../actions/types';

var _ = require('lodash');

const INITIAL_STATE = {
  data: {},
  loading: false,
  error: '',
  cartData: {},
}; 

export default (state=INITIAL_STATE, action) => {
  switch (action.type) {

    case types.MENULIST_REQUEST_START:
        return { ...state, loading:true, error: '' };

    case types.MENULIST_SUCCESS:
      const newItems = _.mapKeys(array, 'name')
        return { ...state, data: newItems , loading:false, error: 'Success' };

    case types.UPDATE_ITEM: 
       return { ...state, [cartData.name]: action.payload  }

    case types.DELETE_ITEM:
      return _.omit(state, [cartData.name]: action.payload)

    case types.MENULIST_FAILED:
        return { ...state, data: {}, loading:false, error: 'Request failed' };

    default:
        return state;
  }
}

当我调用更新和删除项目操作时出现错误。

Error: cartData is not defined

如果响应更新，我如何更新数量并管理状态？

Answer 1

你需要改变

{ ...state, cartData.name: action.payload  }

es6 计算属性键

{ ...state, [cartData.name]: action.payload  }

Computed property keys