Javascript 如何将月份筛选器应用于表React

下面是我的代码，我正在使用下拉列表和值，例如，单击1月1号，1号值被发送到函数，状态更新，并显示该月记录，但在此之后，当我尝试查看另一个月的数据时，它不会显示。当点击默认设置时，我希望所有数据都和以前一样。 提前谢谢

this.setState((prevState) => {
  if (mon !== null || mon !== 0 || mon !== undefined) {
    const rows = prevState.rows.filter((element) => {
      return element.monthname === mon;
    });
    return {
      rows,
    };
  } else {
    const rows = prevState.rows.filter((element) => {
      return element.monthname !== null;
    });
    return {
      rows,
    };
  }
});

---

给你一个解决方案

this.state={filteredRow:[]}
this.setState（（prevState）=>{
国际单项体育联合会（星期一）{
常量filteredRow=prevState.rows.filter（（元素）=>{
return element.monthname===mon；
});
返回{
滤池
};
}否则{
返回{
filteredRow:prevState.rows
};
}
});给你一个解决方案


this.state={filteredRow:[]}
this.setState（（prevState）=>{
国际单项体育联合会（星期一）{
常量filteredRow=prevState.rows.filter（（元素）=>{
return element.monthname===mon；
});
返回{
滤池
};
}否则{
返回{
filteredRow:prevState.rows
};
}
});不要使用
prevState
：

将
rowsororiginal
与
行一起保持在以下状态：

this.state = {
     rows:[]
     rowsOriginal:[]
}

componentDidMount(){
    fetchRows().then(rows=>this.setState({rows:rows,rowsOriginal:rows})
}

然后始终从
行或原始
进行筛选，并将状态设置为
行
：

this.setState({rows:rowsOriginal.filter((element) => {
      return element.monthname === mon;
})})

设置默认值时：

this.setState({rows:rowsOriginal})

所以

if（mon！==null&&mon！==0&&mon！==未定义）{
this.setState（{rows:rowsororiginal.filter（（元素）=>{
return element.monthname===mon；
})})
}
否则{
this.setState（{rows:rowsOriginal}）
}
不要使用
prevState
：

将
rowsororiginal
与
行一起保持在以下状态：

this.state = {
     rows:[]
     rowsOriginal:[]
}

componentDidMount(){
    fetchRows().then(rows=>this.setState({rows:rows,rowsOriginal:rows})
}

然后始终从
行或原始
进行筛选，并将状态设置为
行
：

this.setState({rows:rowsOriginal.filter((element) => {
      return element.monthname === mon;
})})

设置默认值时：

this.setState({rows:rowsOriginal})

所以

if（mon！==null&&mon！==0&&mon！==未定义）{
this.setState（{rows:rowsororiginal.filter（（元素）=>{
return element.monthname===mon；
})})
}
否则{
this.setState（{rows:rowsOriginal}）
}
你能创建一个小型stackblitz项目来演示你的问题吗？@AhmerMH我是如何使用数据库数据的？只需使用一些4-5个元素的虚拟输入，以及你实际想要排序的日期（或月份）的正确数据。您不需要添加所有列，仅1-2列就足以复制问题；我猜你的问题就在那之外。你能分享剩下的代码吗？你能创建一个小的stackblitz项目来演示你的问题吗？@AhmerMH我是如何使用数据库数据的？只需使用一些4-5个元素的虚拟输入，以及你真正想要排序的日期（或月份）的正确数据。您不需要添加所有列，仅1-2列就足以复制问题；我猜你的问题就在那之外。你能分享剩下的代码吗？
this.setState（{rows:this.state.rowsOriginal.rows.filter（（element）=>{return element.monthname===mon；}）}）
是否需要this.state.rowsOriginal，因为它的生成错误。这起到了一半作用，当单击默认值即0时它不会返回原始行，有一个输入错误rowsOriginal.rowsin没有使用
|
，我使用了
&
与您的解决方案解决了我的问题，问题在于OR运算符。
this.setState（{rows:this.state.rowsOriginal.rows.filter（（element）=>{return element.monthname==mon；}）
是否需要此.state.rowsOriginal，因为它的生成错误。此功能可以正常工作。单击默认值（即值0）时，它不会返回原始行。此外，还有一个输入错误rowsOriginal.rowsn而不是使用
|
，我在您的解决方案中使用了
&&
，解决了我的问题，问题出在操作员身上。@ROHANTONGLE什么不起作用，您能具体说明一下吗？我已经更新了答案。它应该是
prevState.rows
@ROHANTONGLE什么不起作用，你能具体点吗？我已经更新了答案。它应该是
prevState.rows