hospital-accompaniment-wechat/components/star/index.vue

<template>
  <view class="box">
    <text class="iconfont icon-kaixinxingxing" v-for="(v,i) in 5" :key="i" @click="rate(i+1)" :class="{active:i<value}"></text>
  </view>
</template>

<script>
export default {
  data () {
    return {

    }
  },
  props: {
    value: {
      type: Number | String,
      default: 3
    }
  },
  methods: {
    rate (index) {
      this.$emit('change', index)
    }
  },
}
</script>

<style lang='scss' scoped>
.box {
  display: flex;
  > text {
    display: inline-block;
    margin-right: 5rpx;
    color: #b3b3b3;
  }
  > .active {
    color: #f7931e;
  }
}
</style>