首页 > 解决方案 > Vuejs _.orderBy 没有对 json 进行排序

问题描述

更新 下面是我使用 axios 通过 API 获得的 json。

 bannerData= [
        {
          "id": 118,
          "title": "Geruchsbel\u00e4stigung",
          "location": "DOR",
          "pressInformation": [
            {
                "id": 257,
                "title": "Chemi257"
              },
              {
               "id": 256,
               "title": "Chemi256",
              }
          ]
        },
        {
          "id": 144,
          "title": "Testing Stage",
          "location": "LEV",
          "pressInformation": [
            {
              "id": 254,
               "title": "Chemi254",
            },
            {
              "id": 261,
               "title": "Chemi261",
            }
          ]
        }
      ]
computed: {
    orderedUsers: function() {
      this.secondSubBanner = [];
      for (let i = 0; i < this.bannerData.length; i++) {
        this.subBanner = this.bannerData[i].pressInformation;
        for (let j = 0; j < this.subBanner.length; j++) {
          this.secondSubBanner.push(this.subBanner[j].id);
          console.log(this.secondSubBanner); // output: 257, 256, 254,261
        }
      }
      return this.secondSubBanner;
    },
sortedArray() {
      let v = this.orderedUsers.sort();
      console.log(v); // output: 254, 256, 257, 261
      return _.orderBy(this.bannerData, v)
    }

sortedArray 正在使用 sort() 按顺序打印 id。但它不能对 Json 属性进行排序,这取决于使用_.orderBy(). 谁能说我在哪里做错了?

标签: javascriptvue.jsvuejs2lodash

解决方案


试试这个算法。我认为你想要什么,你不需要lodash。我只使用flatMap()sort()内置来获得这个:

function sortedArray(bannerData) {
  const array = bannerData.flatMap(x => x.pressInformation)
  return array.sort( (a,b) => a.id - b.id )
}

bannerData = [
  {
    "id": 118,
    "title": "Geruchsbel\u00e4stigung",
    "location": "DOR",
    "pressInformation": [
      {
        "id": 257,
        "title": "Chemi257"
      },
      {
        "id": 256,
        "title": "Chemi256",
      }
    ]
  },
  {
    "id": 144,
    "title": "Testing Stage",
    "location": "LEV",
    "pressInformation": [
      {
        "id": 254,
        "title": "Chemi254",
      },
      {
        "id": 261,
        "title": "Chemi261",
      }
    ]
  }
]

console.log(sortedArray(bannerData))


推荐阅读