Vuejs _.orderBy 没有对 json 进行排序答案

【问题标题】：Vuejs _.orderBy is not sorting the jsonVuejs _.orderBy 没有对 json 进行排序
【发布时间】：2019-12-23 15:33:59
【问题描述】：

更新下面是我使用 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()。谁能说我哪里做错了？

【问题讨论】：

_.orderBy() 不是 Undersore / Lo-Dash 功能吗？
是的，它是一个lodash函数，我已经导入了lodash库<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.js"/>
bannerData 看起来像什么？为什么要将v 作为第二个参数传递给orderBy？
我已经更新了我的问题
@SreenivasuluGudipati 你的排序后想要的输出是什么？

标签： javascript vue.js vuejs2 lodash

【解决方案1】：

试试这个算法。我认为你想要什么，你不需要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))

【讨论】：

@Sreenivasulu Gudipati 这回答了你的问题吗？
非常感谢。您的逻辑显然是解决方案，但这里的“dataBanner”会产生“pressInformation”内的对象的排序。当我使用'v-for="events in dataBanner"'循环渲染时，我只能渲染'pressInformation'内的对象。我还需要在同一个 v-for 循环中访问诸如“位置”之类的属性，这是不可能的..
我不确定你的问题的具体背景是什么，但它首先闻到了错误的策略设计。归根结底，如果这个答案以某种方式显然是您提出的问题的解决方案，请考虑接受它。
当然我接受你的回答，它帮助了我。它比我的脂肪功能要薄得多。我必须找到一种方法在 console.log(sortedArray(bannerData)) 的同一 v-for 循环中呈现 location 属性
@SreenivasuluGudipati 希望您能尽快解决问题