Javascript 如何使用setState reactjs在数组中推送对象? 类组件中的我的状态

Javascript 如何使用setState reactjs在数组中推送对象? 类组件中的我的状态,javascript,arrays,reactjs,setstate,Javascript,Arrays,Reactjs,Setstate,下面给出的状态在我的类组件中 我需要在starttime数组中添加以下示例动态对象 this.state = { frequency: { starttime: [], }, }; 下面给出的示例对象 {time:"20:15",timezone:"IST"}, {time:"01:30",timezone:"UST"} 上面的对象是我处理的动态对象 我的要求是必须使用reactjs中的

下面给出的状态在我的类组件中

我需要在starttime数组中添加以下示例动态对象

this.state = {
   frequency: {
       starttime: [],
   },
};
下面给出的示例对象

{time:"20:15",timezone:"IST"},
{time:"01:30",timezone:"UST"}
上面的对象是我处理的动态对象

我的要求是必须使用reactjs中的
setState
将这些对象推送到starttime数组中

预期结果如下

this.state = {
   frequency: {
      starttime: [{time:"20:15",timezone:"IST"},
         {time:"01:30",timezone:"UST"},
         {time:"13:00",timezone:"UST"},...],
      },
};

假设您有一个名为
newTimes
的变量中的数据,该变量需要在状态中更新为
starttime
。下面是您可以更新它的方法之一。有关更新时如何使用先前状态的更多详细信息,请参阅

let newTimes = [{time:"20:15",timezone:"IST"}, {time:"01:30",timezone:"UST"}];
this.setState(state => ({
  ...state,
  frequency: {
    starttime: [...state.frequency.starttime, ...newTimes]
  }
}))
如果您想根据条件从
newTimes
数组中删除某些元素,那么将非常方便。为了简单起见,我正在考虑根据
时区
过滤数据,下面是一个示例

let newTimes = [{time:"20:15",timezone:"IST"}, {time:"01:30",timezone:"UST"}, {time:"16:45",timezone:"GMT"}];
//Removing all the timezones which are of "UST".
//You can change this condition as per your requirement.
const filteredTimes = newTimes.filter(({ timezone }) => timezone !== "UST");
this.setState(state => ({
  ...state,
  frequency: {
    starttime: [...state.frequency.starttime, ...filteredTimes]
  }
}))

从阵列中删除重复项的方法有多种,请参阅下文

  • 使用及
newTimes=[{时间:“20:15”,时区:“IST”},{时间:“01:30”,时区:“UST”},{时间:“16:45”,时区:“GMT”},{时间:“20:15”,时区:“IST”},{时间:“20:15”,时区:“PST”},{时间:“12:30”,时区:“IST”};
const removeDuplicates=(次)=>{
const finalRes=次数减少((res,timeObj)=>{
const{time,timezone}=timeObj;
常量键=`${time}{timezone}`;
//检查时间或时区是否与结果对象的任何属性不相同。
//如果其中一个不匹配,则将其添加到res对象
if(res[key]?.time!==timeObj.time | | res[key]?.timezone!==timeObj.timezone){
res[key]={…timeObj}
}
返回res;
}, {});
//最后,通过将对象转换为数组来返回该对象的值。
返回Object.values(finalRes);
}
console.log(删除的副本(新时间))
。作为控制台包装器{
最大高度:100%!重要;

}
只需使用扩展运算符将上一个对象状态与新的时间序列组合起来即可

见下例:

let times = [];
times.push({time:"20:15",timezone:"IST"},{time:"01:30",timezone:"UST"});



this.setState({
   ...this.state, // spread here to prevent removing other key object if present
   frequency: {
     starttime : [...this.state.frequency.starttime, ...times] // merge previous value with new array
   }
})

到目前为止你试过什么?这是react教程中通常涉及的内容。如何删除添加了i starttime的中的某些对象?如何不在数组中添加重复对象,例如[{time:“20:15”,timezone:“IST”},{time:“20:15”,timezone:“IST”}],我应该避免重复。。这是否可能?以及如何删除添加了i starttime的中的某些对象?我已通过从数据中删除一些对象更新了答案。请看一看。如何不在数组中添加重复对象例如[{time:“20:15”,timezone:“IST”},{time:“20:15”,timezone:“IST”}]我应该避免重复。。这可能吗?是的,Sanjaikumar,这是可能的。我已经通过添加相应的代码片段更新了我的答案,请看一看。谢谢。。但我要求避免在数组中添加重复对象