Vue - 在v-repeat中使用計算屬性


1、從后端獲取JSON數據集合后,對單條數據應用計算屬性,在Vue.js 0.12版本之前可以在v-repeat所在元素上使用v-component指令

Vue.js 0.12版本之后使用自定義元素組件實現v-repeat中使用計算屬性

 1 <div id="items">
 2     <my-item v-repeat="items" inline-template>
 3         <button>{{fulltext}}</button>
 4     </my-item>
 5 </div>
 6 
 7 <script type="text/javascript">
 8     var items = [
 9         {number : 1,text : 'one'},
10         {number : 2,text : 'two'}
11     ]
12 
13     var vue = new Vue({
14         el : '#items',
15 
16         data : {items : items},
17 
18         component : {
19             'my-item' : {
20                 replace : true ,
21                 computed : {
22                     fulltext : function(){
23                         return 'item' + this.text
24                     }
25                 }
26             }
27         }
28     })
29 </script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM