如何更新对象数组中具有相同名称的所有键?
how to update all keys with the same name in a array of objects?
我正在使用 React 和 Redux,并希望将每个 'volume' 键值递减 0 到 20(均包含在内)之间的随机数,然后更新状态数组。
我的数组是这样的:
const arr = [
{id: 1, volume: 100, isEmpty: false},
{id: 2, volume: 100, isEmpty: false}
]
这是我的动作:
const decrementAction = () => {
return {
type : 'DECREMENT'
}
}
我的reducer是这样的:
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};
我在 运行 我的代码时遇到了一些问题:
1 - 每个值都相同,而不是为每个对象获取随机值(已解决)
2 - 值既递增又递减,而不是仅递减
请问我做错了什么?
谢谢
考虑在你的 reducer 中的 state = newArray
之后放置一个 break;
,这至少应该可以解决你的第二个问题:
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray;
break;
}
};
Javascript 开关参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch
首先,您只能获得一次随机数。你每次都需要一个新的随机数。
尝试 运行 整个循环,并像您当前所做的那样通过解构它们来继续添加项目。
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
let newArr = [];
for(let i = 0 ; i < arr.length; i++) {
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newObj = {
...arr[i],
volume : arr[i].volume - randomNumber
};
newArr.push(newObj);
}
return newArr;
break;
}
};
另外我相信使用 redux 你应该 return 状态。
我找到了解决方案...
而不是
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};
第 5 行我将状态称为 'arr',但我应该将状态称为 'state',如下所示。
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = state.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};
我正在使用 React 和 Redux,并希望将每个 'volume' 键值递减 0 到 20(均包含在内)之间的随机数,然后更新状态数组。
我的数组是这样的:
const arr = [
{id: 1, volume: 100, isEmpty: false},
{id: 2, volume: 100, isEmpty: false}
]
这是我的动作:
const decrementAction = () => {
return {
type : 'DECREMENT'
}
}
我的reducer是这样的:
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};
我在 运行 我的代码时遇到了一些问题:
1 - 每个值都相同,而不是为每个对象获取随机值(已解决)
2 - 值既递增又递减,而不是仅递减
请问我做错了什么?
谢谢
考虑在你的 reducer 中的 state = newArray
之后放置一个 break;
,这至少应该可以解决你的第二个问题:
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray;
break;
}
};
Javascript 开关参考:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch
首先,您只能获得一次随机数。你每次都需要一个新的随机数。
尝试 运行 整个循环,并像您当前所做的那样通过解构它们来继续添加项目。
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
let newArr = [];
for(let i = 0 ; i < arr.length; i++) {
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newObj = {
...arr[i],
volume : arr[i].volume - randomNumber
};
newArr.push(newObj);
}
return newArr;
break;
}
};
另外我相信使用 redux 你应该 return 状态。
我找到了解决方案...
而不是
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = arr.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};
第 5 行我将状态称为 'arr',但我应该将状态称为 'state',如下所示。
const containers = (state = arr, action) => {
switch(action.type){
case 'DECREMENT':
const randomNumber = Math.floor(Math.random() * 20) + 0;
const newArr = state.map(item => {
const newObj = {
...item,
volume : item.volume - randomNumber
}
return newObj;
});
state = newArray
}
};