Vuejs2 - コンポーネントの計算プロパティ

Question

名前を表示するコンポーネントがあります。私は各名前の文字数を計算する必要があります。 計算されたプロパティとしてnameLengthを追加しましたが、vuejsはループ内でこのプロパティを決定しません。

var listing = Vue.extend({ 
    template: '#users-template', 
    data: function() { 
     return { 
      query: '', 
      list: [], 
      user: '', 
     } 
    }, 
    computed: { 
     computedList: function() { 
      var vm = this; 
      return this.list.filter(function (item) { 
       return item.toLowerCase().indexOf(vm.query.toLowerCase()) !== -1 
      }) 
     }, 
     nameLength: function() { 
      return this.length; //calculate length of current item 
     } 
    }, 
    created: function() { 
     this.loadItems(); 
    }, 
    methods: { 
     loadItems: function() { 
      this.list = ['mike','arnold','tony'] 
     }, 
    } 
}); 

http://jsfiddle.net/apokjqxx/22/

ので

マイク-4

アーノルド-6

トニー-4

Answer 1

を期待される結果には、計算されたプロパティに関するいくつかの誤解があるようです。 私はあなたからfiddleを作成しました。それは必要に応じて機能します。コメントで

http://jsfiddle.net/6vhjq11v/5/

nameLength: function() { 
    return this.length; //calculate length of current item 
} 

それは 「現在の項目の長さを計算」が、jsのは、これがVueのコンポーネントそれを自己の上に長さを実行します

this.length 

現在の項目の概念を得る傾けることを示していますその価値にではありません。

計算されたプロパティは、インスタンスと戻り値の他のプロパティで動作します。

ここでは何も指定していないので、このプロパティを使用することはできません。

これ以上の情報が必要な場合はコメントください。