使用V-bind动态添加class

<li :class="{completed:item.completed}" v-for='item in list' :key="item.id">

                        <div class="view">

                            <input class="toggle" type="checkbox" checked>

                            <label>{{item.name}}</label>

                            <button class="destroy"></button>

                        </div>

                        <input class="edit" value="Create a TodoMVC template">

</li>

 

 

下面是数据，completed控制样式

data:{

            list:[

                {id:1,name:'抽烟',completed:false},

                {id:1,name:'喝酒',completed:true},

                {id:1,name:'烫头',completed:false},

            ]

        },

转载于:https://www.cnblogs.com/xiannv/p/10995930.html