首页 > 解决方案 > 从数组映射中过滤多个项目 React JS

问题描述

我有一个从以下数组填充的表单中的选择类型:

constructor(props) {
        super(props);
        this.state = {
 timeslots:["17:00","17:15","17:30","17:45","18:00","18:15","18:30","18:45","19:00"],
}}

如果该日期在数据库中已知具有相同的时隙,则必须过滤掉该时隙。现在他只在 1 天取出 1 个值。

例如,我有数组:

this.state.timeslotsDisabled: ["17:00","17:30"]

我想用这个函数过滤掉以下值:

handleDayClick(day) {
    this.setState({
        timeslots: this.state.timeslotsReset
    })

    for(let i = 0; i< this.state.timeslotsDisabled.length; i++){

            if(new Date(this.state.timeslotsDisabled[i].date).getFullYear() == day.getFullYear() && new Date(this.state.timeslotsDisabled[i].date).getMonth() == day.getMonth() && new Date(this.state.timeslotsDisabled[i].date).getDate() == day.getDate()){
                console.log('same');
                console.log('GONE:'+ this.state.timeslotsDisabled[i].time)
                this.setState({
                    timeslots: this.state.timeslots.filter((item)=> item !== this.state.timeslotsDisabled[i].time),
                })
            }else{
                console.log('else');
            }

    }
    this.setState({
      selectedDay: day,
    });
}

但他只过滤1个这样的值: 在此处输入图像描述

所以我希望“17:00”和“17:30”都不再可见。如您所见,只有 17:00 不再可用。如果我有 1 个值,它会起作用。有人可以告诉我我做错了什么吗?

标签: javascriptarraysreactjs

解决方案


timeslots.filter(timeslot => !timeslotsDisabled.includes(timeslot));


推荐阅读