vue基礎學習之v-for
阿新 • • 發佈:2018-12-30
<style> .completed{ text-decoration: line-through; } </style> <body> <script type="text/javascript" src="js/vue.js" ></script> <div id="app"> <ul> <li @click="toopposite(task)" v-bind:class="{'completed':task.completed}" v-for="task in tasks">{{task.body}}</li> </ul> </div> <script type="text/javascript"> var app =new Vue({ el:'#app', data:{ tasks:[ {body:'this is first',completed:false}, {body:'this is second',completed:true}, {body:'this is lase',completed:false} ] }, methods:{ toopposite:function(task){ task.completed = !task.completed; } } }) </script> </body>