gpt4 book ai didi

javascript - 使用 redux 根据当前值更新对象数组中的单个对象属性

转载 作者:行者123 更新时间:2023-12-01 03:23:31 28 4
gpt4 key购买 nike

在我的状态中,我有一个对象数组,这些对象具有一些描述性属性、数量和唯一 ID。该对象中的数据来自 API 响应,在我的操作创建器中,我检查状态以查看它是否已存在,如果存在,则为我的 reducer 分派(dispatch)增量操作。这就是我的 Action 创建器的样子:

export const getProductDetails = upc => (dispatch, getState) => {
const state = getState();
const products = state.table.products;
if (_find(products, upc) !== undefined) {
dispatch({ type: INCREMENT_QUANTITY, payload: upc });
} else {
axios
.post(<--POST TO ENDPOINT-->) }
})
.then(res => {
dispatch({ type: POST_UPC, payload: res.data });
})
.catch(err => {
errorHandler(dispatch, err.response, AUTH_ERROR);
});
}
};

我的 reducer 在这种情况下的结构如下:

case INCREMENT_QUANTITY:
return {
...state,
products: state.products.map(product => {
action.payload === product.upc
? { ...product, quantity: product.quantity + 1 }
: product;
})
};

我基于这个 reducer 逻辑 this excellent response ,但由于某种原因,当分派(dispatch)操作时,重复的产品将被覆盖为 null,而不是按预期增加数量。我现在仍在尝试学习 redux,所以请原谅我的无知。理想情况下,我希望避免仅仅为了增加值而引入库或包。我的 reducer 到底缺少什么?

最佳答案

您没有在 map 回调中返回任何内容,您正在创建一个 block ,因此您无法获得预期的结果。相反,请省略括号 { … }:

products: state.products.map(product => 
action.payload === product.upc
? { ...product, quantity: product.quantity + 1 }
: product;
);

这将使用箭头函数语法隐式返回三元运算符的结果。

关于javascript - 使用 redux 根据当前值更新对象数组中的单个对象属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44992689/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com