zoukankan      html  css  js  c++  java
  • JS 案例,将数据改造

    一般后端请求来的数据,需要转换为自己需要的格式 城市列表案例

    目的:为了搭建城市列表查询

    原因:因为后端传来的数据,不能直接拿来使用,需要自己用js改造数据格式

    • 下图是请求到数据

    image-20201130154950523

    • 目标转为:

    image-20201130162258362

    1.先创建26个字母,通过ASCII值

    const letterArr = [];
          for (let code = 97; code < 123; code++) {
            letterArr.push(String.fromCharCode(code));
          }
    

    2.根据每个对象的拼音首字母进行过滤

    const list = cities.filter((item) => item.pinyin.substring(0, 1) === letter);
    

    filter过滤器,传入自己,加入条件进行过滤

    3.遍历自己,将一个字母与之对应

    letterArr.forEach((letter) => {
            const list = cities.filter(
              (item) => item.pinyin.substring(0, 1) === letter);
              // console.log(list);
          });
    

    4.最后创建新数组,将有数据的数组加入,并创建需要的格式类型

    methods: {
        handleCityData(cities) {
          const newcitylist = [];
          const letterArr = [];
          for (let code = 97; code < 123; code++) {
            letterArr.push(String.fromCharCode(code));
          }
          // console.log(letterArr);
          letterArr.forEach((letter) => {
            const list = cities.filter(
              (item) => item.pinyin.substring(0, 1) === letter);
              // console.log(list);
              if(list.length>0){
                newcitylist.push({
                  type:letter,
                  list:list
                })
              }
          });
          console.log(newcitylist);
        },
      },
    
  • 相关阅读:
    转载的,讲解java.util的集合类
    LinkedList
    数据结构
    随笔
    spring boot初步尝试
    spring boot
    java8 新特性
    volatile 续
    java 线程基础学习
    java 基础
  • 原文地址:https://www.cnblogs.com/Ssinoo/p/14062068.html
Copyright © 2011-2022 走看看