首页 > 其他分享 >【React工作记录五十九】根据key值过滤形成新得数组

【React工作记录五十九】根据key值过滤形成新得数组

时间:2023-05-22 10:01:09浏览次数:43  
标签:新得 orderStatusList value React item key 歌谣


 

目录

前言

导语

 核心实现代码

运行结果


前言

我是歌谣 我有个兄弟 巅峰的时候排名c站总榜19 叫前端小歌谣 曾经我花了三年的时间创作了他 现在我要用五年的时间超越他 今天又是接近兄弟的一天人生难免坎坷 大不了从头再来 歌谣的意志是永恒的 放弃很容易 但是坚持一定很酷

导语

根据key值过滤形成新得数组

【React工作记录五十九】根据key值过滤形成新得数组_数组

【React工作记录五十九】根据key值过滤形成新得数组_数组_02编辑

 核心实现代码

var arr = [{ key: '', value: '所有' }];
    orderStatusList &&
      orderStatusList.map((item) => {
        if (
          item.key == '1202011271718478888579391' ||
          item.key == '1202011271718328888637809' ||
          item.key == '1202011271718158888762334' ||
          item.key == '116345258629988888989281' ||
          item.key == '1202011271719298888433205' ||
          item.key == '1202011271718568888010433'
        )
          arr.push({
            key: item.key,
            value: item.value,
          });
      });

【React工作记录五十九】根据key值过滤形成新得数组_数组_03

运行结果

【React工作记录五十九】根据key值过滤形成新得数组_数组_04

【React工作记录五十九】根据key值过滤形成新得数组_数组_05编辑

标签:新得,orderStatusList,value,React,item,key,歌谣
From: https://blog.51cto.com/u_14476028/6321043

相关文章

  • react-create-app 创建的项目添加保存自动格式化
    前言首先,react-create-app创建的项目是自带安装eslint的,所以我们要安装prettier及相关插件参考=>https://juejin.cn/post/6844903901544742925安装的包这些都是开发时依赖,注意安装位置eslint-config-react-app打开modules文件,可以看到是已经预安装的,无需重复......
  • iOS的KeyChain(钥匙串)的使用
    iOS的KeyChain(钥匙串)的使用Keychain钥匙串存储账号和密码,还可以多个应用之间分享此账号和密码,只需要配置一项,如下一张图片-1.iOS的keychain提供一种安全保存信息的方式,-2.可以保存密码等数据,而且keychain中的数据不会因为你删除app而丢失,-3.你可以在重新......
  • [图解] 完全自由软件[WinScp+Putty+Pageant]之Public Key Authentication方式登陆SSHD
    将几样自由软件结合到一起,完成强大的PublicKeyAuthentication方式登陆SSHD用到的软件为Putty:PuTTY:AFreeTelnet/SSHClientWinScp:FreewareSFTPandSCPclientforWindowPuttyGen:包含于WinScp的安装包里面Pageant:包含于WinScp的安装包里面安装之后,全程图解如下:1,看看我......
  • 完全自由软件[WinScp+Putty+Pageant]之Public Key Authentication方式登陆SSHD
    将几样自由软件结合到一起,完成强大的PublicKeyAuthentication方式登陆SSHD用到的软件为Putty:PuTTY:AFreeTelnet/SSHClientWinScp:FreewareSFTPandSCPclientforWindowPuttyGen:包含于WinScp的安装包里面Pageant:包含于WinScp的安装包里面安装之后,全程图解如下:1,看看......
  • React 入门实例教程
    现在最热门的前端框架,毫无疑问是 React 。上周,基于React的 ReactNative 发布,结果一天之内,就获得了5000颗星,受瞩目程度可见一斑。React起源于Facebook的内部项目,因为该公司对市场上所有 JavaScriptMVC框架,都不满意,就决定自己写一套,用来架设 Instagram 的网站。做出......
  • [React] useEffect
    purefunction:单纯返回jsx元素的组件在使用react函数组件时,理论上函数组件只会进行不改变内部状态值的计算,以及返回html代码。一个pure函数就是如此,例如一个函数组件接受一个id作为传入属性,注意这里传入的id并没有发生变化,我们只是简单进行了输出和数学计算://thisisapurefu......
  • 苹果爸爸发飙,封杀 React Native?
    今天早上一上班,就收到了苹果发来的一封警告邮件,一看内容,就知道这是个大事啊,还赶紧发了个微博,然后,今天一整天,iOS界都被这个消息炸裂了!这封警告邮件大概意思就是说,苹果将不再允许使用动态下发代码的机制,如果App内部使用了动态下发代码的框架,将有被拒的风险。所谓的动态下发代码,就......
  • React闭包陷阱
    React闭包陷阱ReactHooks是React16.8引入的一个新特性,其出现让React的函数组件也能够拥有状态和生命周期方法,其优势在于可以让我们在不编写类组件的情况下,更细粒度地复用状态逻辑和副作用代码,但是同时也带来了额外的心智负担,闭包陷阱就是其中之一。闭包从React闭包陷阱的名字......
  • react面试题汇总1
    请介绍一下React的生命周期函数及其调用顺序。答:React的生命周期函数分为三个阶段:挂载、更新和卸载。以下是各个生命周期函数的名称及调用顺序:挂载阶段constructor():组件构造函数,在最开始时调用。staticgetDerivedStateFromProps():从props中派生出state,返回新的state值,会在render......
  • React 源码调试 (react版本17.0.2)
    环境准备//create-react-a匹配版本$create-react-app-V5.0.1//node版本$node-Vv16.16.0  1、第一步通过create-react-app快速创建环境,然后运行yarneject释放webpack配置  npxcreate-react-appreact-debugyarneject 2、第二步降级reac......