本文是续Vue数据绑定 - 简书一文。
vue绑定属性的语法为attribute=’expression‘
目的
如果是true的话,就在该项事件上加一个删除线
首先为li元素添加checked这个类。
<li v-for='(todo,index) in todos'
:class="{'checked':todo.done}"
>{{index+1}} {{todo.value}}
</li>
上述代码的作用如图
image.png
接着为class=’checked‘的项目单独设置样式。这里用来属性选择器。 line-through代表删除线。
li[class='checked'] {
text-decoration: line-through;
}
最终结果如图
image.png