#yyds干货盘点 【React工作记录七】如何对数组进行一个过滤操作map

简介: #yyds干货盘点 【React工作记录七】如何对数组进行一个过滤操作map

需求

今天产品找到我 你这边切换的状态数据太多了需要进行一个过滤


解决思路

我们先来看一下数据的一个格式

0: {key: '1202103251527168888718235', value: '已创建', sortKey: 0}
1: {key: '1202012151142378888180559', value: '待审核', sortKey: 1}
2: {key: '1202012151142538888575854', value: '已审核', sortKey: 2}
3: {key: '1202103251003198888698119', value: '审核不通过', sortKey: 3}
4: {key: '1202104011841058888608955', value: '审核中(作废)', sortKey: 5}
5: {key: '1202104021508208888148066', value: '已取消', sortKey: 6}
6: {key: '116322908368408888582803', value: '自动审核', sortKey: 7}

代码



let arr=[]
 RecentList.map(item => {
     if(item.key!=='1202103251527168888718235'&&item.
key!=='1202104011841058888608955'&&item.key!=='116322908368408888582803'){
       arr.push({key:item.key,value:item.value})
     }
   })

运行结果

image.png

相关文章
|
数据安全/隐私保护
Ant Design Pro:权限管理
Ant Design Pro:权限管理
384 0
|
前端开发
修改Ant Design 按钮的样式
修改Ant Design 按钮的样式
1172 0
|
11月前
|
前端开发 UED
React 文本区域组件 Textarea:深入解析与优化
本文介绍了 React 中 Textarea 组件的基础用法、常见问题及优化方法,包括状态绑定、初始值设置、样式自定义、性能优化和跨浏览器兼容性处理,并提供了代码案例。
378 10
|
JavaScript Java 区块链
经常忘记网址?将Vue项目一键打包为桌面客户端 十分钟让你解决烦恼(一)
经常忘记网址?将Vue项目一键打包为桌面客户端 十分钟让你解决烦恼
419 0
|
前端开发
|
C# 数据安全/隐私保护 计算机视觉
C#开发者的新选择:使用ImageSharp进行图像处理
C#开发者的新选择:使用ImageSharp进行图像处理
1564 8
|
机器学习/深度学习 弹性计算 算法
阿里云服务器ECS中长期成本节省计划简介,助你优化上云成本
在云计算时代,企业对于云资源的需求日益增长,如何在保障业务稳定运行的同时,有效控制成本,成为许多企业关注的焦点。阿里云针对这部分用户的需求推出了ECS中长期成本节省计划(Saving Plan),节省计划是一种折扣权益计划,可以抵扣按量付费实例(不含抢占式实例)的账单。相比包年包月实例、预留实例券+按量付费实例的组合,节省计划+按量付费实例的组合在使用上更加灵活。本文将详细介绍这一计划的核心优势、应用场景以及如何参与,助您轻松优化上云成本。
阿里云服务器ECS中长期成本节省计划简介,助你优化上云成本
|
JavaScript 前端开发 数据可视化
正则表达式完整指南(下)
正则表达式完整指南(下)
564 0
正则表达式完整指南(下)