v-select 按“项目文本”排序

Question

我有一个使用 vuetify 制作的 v-select。如何从最大到最小对这个 v-select 中的项目进行排序？

<v-select
  v-model="selectedFruits"
  :items="fruits"
  label="Favorite Fruits"
  item-text="name"
  return-object
  multiple
>

 fruits: [
       'Eggplant',
        'Bananas',
        'Huckleberries',
        'Blackberries',
        'Dates',
        'Figs',
        'Honeydew melons',
        'Kiwis',
        'Lemons',
        'Limes',
        'Peaches',
        'Mangos',
        'Mulberries',
        'Muskmelon',
        'Pineapple',
        'Papaya',
        'Persimmon',
        'Plums',
        'Kumquat',
        'Zucchini',
      ],

我使用排序方法但失败了。

Answer 1

由于 sort 方法改变了原始数组，您可以在挂载的钩子中运行 this.fruits.sort() ：

data(){
   return{
    fruits:[....]
  }
},
mounted(){
  this.fruits.sort()
}