vue中实现一个评分星级功能
不多说直接上代码
星星是使用的iconfont图标
<div>
<ul>
<li
v-for='item in list'
>
<span class="iconfont icon-start-copy " :style="{color:item.isred?'gray':'red'}" @click ="cools(item.id)"></span>
</li>
</ul>
</div>
js部分
data(){
return{
list:[{id:1,isred:true},{id:2,isred:true},{id:3,isred:true},{id:4,isred:true},{id:5,isred:true}]
}
},
methods:{
cools(id){
this.list.forEach(element => {
if(element.id<=id){
element.isred = false
}else{
element.isred = true
}
});
}
},