如何对具有多列的json进行排序答案

【问题标题】：how to sort json with multiple columns如何对具有多列的json进行排序
【发布时间】：2022-01-07 19:46:35
【问题描述】：

我正在使用BootstrapVue。

我有一个结构如下的 json（在完整问题中称为 json）

[
    {"ID": "1", "Name": "Harry", "Age": "18"},
    {"ID": "2", "Name": "Ron", "Age": "18"},
    {"ID": "3", "Name": "Hermione", "Age": "18"},
    {"ID": "4", "Name": "Ginny", "Age": "18"},
    {"ID": "5", "Name": "Fred", "Age": "18"},
]

在我的模板中，我在<b-form-select> 中显示如下：

<b-form-select class="showPointer">
  <option v-for="item in json" :key="item.id">
    ID: {{ item.id}}, Name: {{ item.name}}, Age: {{ item.age}}
  </option>
</b-form-select>

现在我的问题：我想根据我的name sort 它，我知道我必须首先将它放入computed-function 但我不知道如何..

但我想在我的template 中显示它，就像上面的示例一样（ID，比姓名，比年龄）。

感谢您的帮助！谢谢！

【问题讨论】：

JSON 是一种用于数据交换的文本符号。 (More here.) 如果您正在处理 JavaScript 源代码，而不是处理 string，那么您就不是在处理 JSON。

标签： javascript vue.js vuejs2 bootstrap-vue

【解决方案1】：

您不需要为此计算。

您可以在收到请求响应后立即对其进行排序。

例子

get(....).then(response=> { 
    this.json = response.sort((a,b) => a.name - b.name)
})

【讨论】：

【解决方案2】：

Abregre 是对的，你不需要为此计算。

但无论如何，您都可以像这样使用计算：

<option v-for="item in sortedJson" :key="item.id">

computed: {
  sortedJson () {
    return this.json.sort((a, b) => a.Name - b.Name)
  }
}

【讨论】：