我有一个数组,里面有一些对象。每个对象都包含一些属性。
我使用 vue.js v-for 方法将其呈现在列表中。
但我无法按照给定属性的特定顺序呈现它。我使用此函数对其进行升序排序:
evenNumbers: function () {
return this.numbers.sort(function (a, b) { return a - b });
}
它适用于像 [22, 1, 2, 3, 4, 5] 这样的简单数组。但它不适用于这样的对象:
numbers2: [
{
name: 'Alan',
age: 72
},
{
name: 'Thomas',
age: 32
},
{
name: 'Thomas',
age: 32
},
{
name: 'Michal',
age: 32
},
]
}
我想按年龄升序对它们进行排序。
最后,我想将它们渲染在 li 内,例如仅 {{age }} 属性。
最佳答案
由于您现在拥有复杂的对象,因此直接按对象排序将无法按您的预期进行(运算符运行一些隐式转换,导致每次比较都为 NaN
)。
您必须按特定属性排序,在本例中为年龄
。所以:
evenNumbers2: function () {
return this.numbers2.sort(function (a, b) { return a.age - b.age });
}
参见updated fiddle .
关于javascript - Vue.js - 如何按特定属性对数组内的对象进行排序并使用 "v-for"渲染它,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55366066/