zoukankan      html  css  js  c++  java
  • filter() 与 map() ,数据过滤以及接口数据映射

            list: pois.filter((item) => {
              return item.photos.length
            }).map((item) => {
              return {
                type: item.type,
                img: item.photos[0].url,
                name: item.name,
                price: Math.floor(Math.random() * 100),
                comment: Math.floor(Math.random() * 1000),
                rate: Math.floor(Math.random() * 10 / 2),
                scene: item.tag,
                status: '可订明日',
                location: item.location,
                module: item.type.split(';')[0]
              }
            }),

    filter 过滤,当item 元素的 photos 里面有图片的时候,我们才要,没有就不要了

    也可以简写 

    pois.filter(item=> item.photos.length) 满足条件的我就要,不满足的就不要

    --------------------------------------------------------------------

    接口数据映射 map()函数

    map((item) => {
              return {
                type: item.type,
                img: item.photos[0].url,
                name: item.name,
                price: Math.floor(Math.random() * 100),
                comment: Math.floor(Math.random() * 1000),
                rate: Math.floor(Math.random() * 10 / 2),
                scene: item.tag,
                status: '可订明日',
                location: item.location,
                module: item.type.split(';')[0]
              }
            })

    最后返回的数据结构 是你定义好的 type,img,name 等等

    Q:那么为什么要使用map呢?

    A:如果,后端改api接口字段了,前端之前的字段没有改,那么我可以能一次要改很多地方,而且数据格式可能还不一样的;

    前端一定要有自己的数据字段,使用map() 直接接口数据映射,我后面就只改映射时的字段就好!

    切记,切记,坑进去了,就要爬出来!

  • 相关阅读:
    根据模板自动生成数据
    CSV to XLSX (专用)
    释放用完的Excel COM组件
    配置文件的力量
    字符编解码的故事(ASCII,ANSI,Unicode,Utf-8区别)
    将结果中的省略号内容全部输出
    Powershell变量的类型
    一些用过的C#类库收集
    运算符
    特殊运算符
  • 原文地址:https://www.cnblogs.com/suni1024/p/12134133.html
Copyright © 2011-2022 走看看