星級(jí)圖標(biāo)評(píng)分
判斷vue
export default{
props:["score"],
data(){
????????return{
????????????starclass:[]
? ? ? ? }
},
//插入三個(gè)類乍钻，on off half湿刽，starclass是一個(gè)保存星星class類的數(shù)組元媚，class=on 表示一整個(gè)星星
class=off表示空星星；class=half表示半個(gè)星星黑滴，
created(){
????????itemClass:{
????????????const? LENGTH=5;
? ? ? ? ? ? //this.score是從數(shù)據(jù)中獲取
? ? ? ? ? ? ?let? intScore=parseInt(this.score);
? ? ? ? ? ? ?let? sy=this.score-intScore;
? ? ? ? ? ? ?console.log(sy);
????????????????for(let i=0;i>intScore;i++)
????????????????????????this.starclass.push("on");
? ? ? ? ? ? ? ? ?}
????????????if(sy>=0.5){
????????????????????this.starclass.push("half");
????????????????}
????????while(this.starclass.length<LENGTH){
????????????????this.starclass.push("off");
????????}
????}
}
通過添加class來實(shí)現(xiàn)星星的狀態(tài)添加
<span? v-for="item in starclass" :class="item"></span>
//---------------------------------------------
