美文网首页
react处理object中的map集合

react处理object中的map集合

作者: 嗨_等风来 | 来源:发表于2017-12-29 14:24 被阅读0次

对于数组和object对象的数据获取,react是比较容易获取的,但是前段时间开发过程中遇到过map集合的数据,数据格式如下:

  list={
    "id": 1,
     actions:{ 
     "create": {
        "id": null,
        "level": 1,
        "name": null,
        "description": "新建",
        "label": "create",
        "url": "user/abc/123",
        "method": "GET"
      },
      "delete": {
        "id": null,
        "level": 1,
        "name": null,
        "description": "删除",
        "label": "delete",
        "url": "user/abc/123",
        "method": "DELETE"
   }
  }
  }

当然这是简化后的数据。
对于这种对象的获取其实直接通过list.actions.create和list.actions.delete是可以获取到的,但是我们从后台获取到数据后并不能确定map中的key值,以及map的个数。

1.对于这种map的操作我们是可以获取到所有actions中的key值的

var ar=_.keys(list.acctions)

此方法返回的是一个数组

['create','delete']

但是直接遍历这个集合,通过获取到的key来取对应的value值是获取不到的,返回udefiend
2.有一种更简单的方法我们可以直接得到map中的value

 const actions=list.actions;
 const usableFunctionDataList = _.map(actions, (data) => data)

返回的数据如下:

actions =  { 
     "create": {
        "id": null,
        "level": 1,
        "name": null,
        "description": "新建",
        "label": "create",
        "url": "user/abc/123",
        "method": "GET"
      },
      "delete": {
        "id": null,
        "level": 1,
        "name": null,
        "description": "删除",
        "label": "delete",
        "url": "user/abc/123",
        "method": "DELETE"
   }
  };
usableFunctionDataList :[{ 
        "id": null,
        "level": 1,
        "name": null,
        "description": "新建",
        "label": "create",
        "url": "user/abc/123",
        "method": "GET"
},{ 
      "id": null,
        "level": 1,
        "name": null,
        "description": "删除",
        "label": "delete",
        "url": "user/abc/123",
        "method": "DELETE"
}]

最终把value转换成了数组,就可以遍历取数据了

相关文章

  • react处理object中的map集合

    对于数组和object对象的数据获取,react是比较容易获取的,但是前段时间开发过程中遇到过map集合的数据,数...

  • Scala 简明速学04 集合-Map

    Scala 简明速学04 集合-Map Map Scala中Map提供键值对集合。 Map的初始化 Scala中的...

  • ES6迭代器学习笔记

    es6中,加上新增的集合对象已经有了4种(Object,Array,Set,Map),Iterator迭代器是提供...

  • JavaSE总结(7)Map

    Collection中的集合称为单列集合,Map中的集合称为双列集合。 一、 java.util.Map...

  • List和Map集合详解

    一、List集合中添加Map集合 双重for循环引发的问题,map集合中后面的内容会覆盖前面的内容,原因是map是...

  • Map接口

    Map接口也是Java集合框架中的一个顶层接口。Map接口在性质上与Collection接口类似,但是它处理的是由...

  • swift中高阶函数之filter、map、flatMap、re

    filter、map、flatMap、reduce都是swift中的高阶函数,对集合的处理代码更简洁,效率更高效 ...

  • ES6标准入门 摘要 (Iterator)

    Iterator JS现在表示“集合”的数据结构,就是Array、Object、Map、Set,用户可以组合使用它...

  • es6内的Map用法复习

    Map和Object有什么相同与不同相同:两者都是键值对的集合(Hash 结构) 。不同:Object 只能用字符...

  • 【五十三】Collections

    underscore为集合类对象提供了一直的接口。集合类是指 Array和Object,暂不支持Map和Set。 ...

网友评论

      本文标题:react处理object中的map集合

      本文链接:https://www.haomeiwen.com/subject/gsmigxtx.html