VUEjsテンプレートで計算された配列の順

Question

私はVUEテンプレートを持っていて、APIから配列を取得します。それは国のリストです。

今私が受け取るIDに応じて、私はこの配列の順序を変更する必要があります....

それは次のようになります。

<template id="select_list"> 
<div class="nfw-row"> 
    <label :for="id">{{ label }}</label> 
    <div> 
     <select :name="id" :id="id" v-model="selected"> 
      <option value="">Please select...</option> 
      <option :value="list_item" v-for="list_item in computedList">{{ list_item.name }}</option> 
     </select> 
    </div> 
</div> 
</template> 

：

Vue.component('select-list', { 
template: '#select_list', 
props: ['id', 'label', 'selected', 'list'], 
computed: { 
    // a computed getter 
    computedList: function() { 

     // I think I need to reorder the array (list) in here? 

    } 
}}); 

私のテンプレートは次のようになります

私は私のリストを注文する必要があるので私は正しい軌道にいるのですか？エントリ5,7,6,10が配列の先頭に配置されていると仮定しましょう。

Answer 1

はい、これはこれを行う方法です。あなたはロダッシュのようなものを使うことができます：

computed: { 
    computedList: function() {  
     return _.sortBy(this.list, [function(o) { return o.id; }]); 
    } 
}});