js方法reduce()，map()处理后台返回数据数据结构多层嵌套问题

后台传的数据格式为嵌套数组，但是前端需要展示栏目数据条，需要平级处理res的数据

解决办法：采用reduce函数记录每一次迭代，每一次迭代里，都在数组里push平铺的全部数组元素，最后删除掉多余的元素，返回由新数组组成的新的对象

/** 查询栏目列表 */
    getList() {
      this.loading = true;
      listRecommendColumn(
        this.addDateRange(this.queryParams, this.dateRange)
      ).then((response) => {
        //this.columnList = response.data.list;
        //数据结构修改为每条栏目数据
        this.columnList = response.data.list.reduce((arr, item) => {
          arr.push(
            ...item.columnInfoVOList.map((i) => {
              const data = { ...i, ...item };
              delete data.columnInfoVOList;
              return data;
            })
          );
          return arr;
        }, []);
        console.log(this.columnList);
        this.total = response.data.totalCount;
        this.loading = false;
      });
    },

最后返回的数据结构：

最后

以上就是幸福云朵为你收集整理的js方法reduce()，map()处理后台返回数据数据结构多层嵌套问题的全部内容，希望文章能够帮你解决js方法reduce()，map()处理后台返回数据数据结构多层嵌套问题所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。