vue评论星星

//js 使用

 var starOffImg = "../../../static/img/xx.png";
 var starOnImg = "../../../static/img/xx_1.png";
export default {
    data() {
      return {
        stars: [{
          src: starOffImg,
          active: false,
          id:1,
      }, {
          src: starOffImg,
          active: false,
          id:2,
      }, {
          src: starOffImg,
          active: false,
          id:3,
      },
      {
          src: starOffImg,
          active: false,
          id:4,

      }, {
          src: starOffImg,
          active: false,
          id:5,
      }
  ],
  starNum: 0,

       
      };
    },
  
    created() {
    },
    methods: {

        //评分
        rating(index) {
           this.starNum = index+1;
      }, 
    }
  };
    //组件使用

 <ul class="starImg">
                    <li v-for="(star,index) in 5" :key="index" @click="rating(index)">
                      <img v-show="index<starNum" src="../../../static/img/xx_1.png" alt />
                      <img v-show="index+1>starNum" src="../../../static/img/xx.png" alt />
                    </li>
    </ul>