Question

这是减速器状态。我需要添加，更新，删除cartData中的对象。第一次，cartData为空。

const initialState = {
   fetchData: {},
   cartData: {}
}

示例：

fetchData: {
  "React":{'name': 'React'},
  "Node":{'name': 'Node'},
}

如果用户ADD_ITEM对书籍做出反应，则新商品会在购物车中添加。

cartData:{
  "React":{'name': 'React', 'quantity': 1}, 
}

如果用户Edit_ITEM对书籍做出反应，则现有项目将在此处更新。

cartData:{
  "React":{'name': 'React', 'quantity': 4}, 
}

如果用户REMOVE_ITEM对书籍做出反应，则在此处将其删除为零。

cartData:{

}

我们如何修改这些操作的redux状态？

尝试使用lodash 。但确实没有成功。

case types.ADD_ITEM:
   return { ...state, cartData: // add new item  }

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

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

Answer 1

您可以使用edit和Object.keys()项的展开式语法以及reduce()和const initialState = { fetchData: {}, cartData: {} } function cartReducer(state = initialState, action) { switch(action.type) { case 'ADD_ITEM': return {...state, cartData: {...state.cartData, ...action.payload}} case 'EDIT_ITEM': return {...state, cartData: {...state.cartData, ...action.payload}} case 'REMOVE_ITEM': let newState = Object.keys(state.cartData).reduce((r, e) => { if(!action.payload[e]) r[e] = state.cartData[e]; return r }, {}) return {...state, cartData: newState} default: return state; } } var state = {} state = cartReducer(undefined, { type: 'ADD_ITEM', payload: {"React":{'name': 'React', 'quantity': 1}} }) console.log(state) state = cartReducer(state, { type: 'ADD_ITEM', payload: {"Node":{'name': 'Node', 'quantity': 2}} }) console.log(state) state = cartReducer(state, { type: 'EDIT_ITEM', payload: {"React":{'name': 'React', 'quantity': 4}} }) console.log(state) state = cartReducer(state, { type: 'REMOVE_ITEM', payload: {"React":{'name': 'React', 'quantity': 1}} }) console.log(state)来删除项目。

    Scanner s = new Scanner(System.in);
    String input = "";
    String message = "";
    System.out.print("Enter the message to encrypt: ");
    input = s.next();  // this message is inserted

    StringBuilder stringBuilder = new StringBuilder();

    for (int i = 0;i<input.length();i++){
        if(i>0 && input.charAt(i) == input.charAt(i-1)){
                stringBuilder.append("X");
                stringBuilder.append(input.charAt(i));

        }else{
            stringBuilder.append(input.charAt(i));
        }
    }

    if ( (stringBuilder.length() & 1) != 0 ) {
        stringBuilder.append("X");
    }
    message = stringBuilder.toString();
    List<String> strings = new ArrayList<String>();

    int index = 0;
    while (index < message.length())
    {
        strings.add(message.substring(index, Math.min(index + 2,
                message.length())));
        // separates the list by two's. i.e. [ST, EV, EN] for "Steven"
        index += 2;
    }
    System.out.println(strings); // prints out list

Answer 2

在行动中：

const editData = (items) => (dispatch) => {
        dispatch({type: 'EDIT_ITEMS', payload: items});
}

在reducer中：

const reducer = (state = INITIAL_STATE, action){
    case 'EDIT_ITEMS': {
         if(_.isEmpty(action.payload)){
                 return {
                         ...state,
                         cartData: {},
                 };
         } else {
                 return {
                         ...state,
                         cellData: action.payload,
                 };
         }
    }
}

这应该是这样做的方法。 payload应该是您在任何时间点购物车中的所有商品。

<强> [编辑：] 在编辑问题后，您也可以使用<{1}}密钥，使用

执行此操作

deleting

Answer 3

很难确切地知道你在尝试什么。下面是一个带有添加到购物车方法的reducer功能的示例。您需要为每个场景添加类似的方法。

export function reducer(state = initialState, action: any): State {
    switch(action.type) {
        case "ADD_TO_CART": {
            return {
                fetchData: state.fetchData,
                cartData: Object.assign({}, state.cartData, action.payload}
            };
        }
    }
    default: {
        return state;
    }
}

然后，您将通过调用调度函数来调度操作：

dispatch({
    type: "ADD_TO_CART",
    payload: "React":{'name': 'React', 'quantity': 1}
})

Redux状态 - 添加/编辑/删除对象及其属性

3 个答案: