如何使用Vue中的竞争函数按字母顺序排列json

Question

如何使用v-for按字母顺序显示类别标题？

我想我应该使用一个计算函数，但我不知道如何重新排列数据对象。

<template>
<div> 
<h3>Categories</h3>
<ul>
<li v-for="category in orderItems" :key="category.id">
{{ category.title }}
</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
categories: [
{
title: "chicken"
id: 1
},
{
title: "beef"
id: 2
},
{
title: "soup"
id: 3
}
]
}
},
computed: {
orderItems: function() {
const results = this.categories.....
return results;
}
}
}
</script>

Answer 1

const results = this.categories.slice().sort((a, b) => a.title.localeCompare(b.title));

Answer 2

orderItems: function() {
function compare(a, b) {
let ac = a.title.toLowerCase();
let bc = b.title.toLowerCase();
if (ac < bc)
return -1;
if (ac > bc)
return 1;
return 0;  
}
return this.categories.sort(compare);
}