时间戳

首页 > 解决方案 > 如何更新对象数组中具有相同名称的所有键？

reactjs - 如何更新对象数组中具有相同名称的所有键？

问题描述

我正在使用 react 和 redux，并希望将每个“volume”键值减少 0 到 20 之间的随机数（都包括在内），然后更新状态数组。

我的数组是这样的：

const arr = [
  {id: 1, volume: 100, isEmpty: false},
  {id: 2, volume: 100, isEmpty: false}
]

这是我的行动：

const decrementAction = () => {
    return {
        type : 'DECREMENT'
    }
}

我的减速机是这样的：

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 - 值同时递增和递减，而不是仅递减

请问，我做错了什么？

谢谢

标签： reactjsreduxstate

解决方案

首先，您只获得一次随机数。您每次都需要一个新的随机数。

尝试循环运行整个事情，并通过像您当前所做的那样解构它们来继续添加项目。

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 你应该返回状态。

推荐阅读