二十一、computed Option 計算選項
阿新 • • 發佈：2018-12-18
computed Option 計算選項
computed 的作用主要是對原資料進行改造輸出。改造輸出：包括格式的編輯，大小寫轉換，順序重排，新增符號……
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="../assets/js/vue.js"></script> <title>Computed Option 計算選項</title> </head> <body> <h1>Computed Option 計算選項</h1> <hr> <div id="app"> {{newPrice}} <hr> <br> <ul> <li v-for="(news,index) in reverseNews"> {{index+1}}、{{ news.title}}:{{ news.date }} </li> </ul> </div> <script type="text/javascript"> var app=new Vue({ el:'#app', data:{ price:100, newsList:[ {title:'香港或就“裝甲車被扣”事件追責 起訴涉事運輸公司',date:'2017/3/10'}, {title:'日本第二大準航母服役 外媒：針對中國潛艇',date:'2017/3/12'}, {title:'中國北方將有明顯雨雪降溫天氣 南方陰雨持續',date:'2017/3/13'}, {title:'起底“最短命副市長”：不到40天落馬，全家被查',date:'2017/3/23'}, ] }, computed:{ newPrice:function(){ return this.price='￥' + this.price + '元'; }, reverseNews:function(){ return this.newsList.reverse(); } } }) </script> </body> </html>