<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>vue基础学习之v-for
猜你喜欢
转载自blog.csdn.net/seven_begain/article/details/79370302
今日推荐
周排行