<template>
	<view class="stars">
		<view class="star" v-for="(item,index) in stars" @click="onStar(item)" :key="index">
			<sl-icon name="icon-star" :color="star>=item?'#f4ea2a':'#ddd'"></sl-icon>
		</view>
	</view>
</template>

<script>
import slIcon from "@/sdk/sl-icon/index.vue"
export default{
	components:{
		slIcon
	},
	props:{
		star:{
			type:Number,
			default:5
		},
		isClick:{
			type:Boolean,
			default:false
		}
	},
	data(){
		return {
			stars:[1,2,3,4,5],
		}
	},
	methods:{
		onStar(item){
			if(this.isClick){
				this.$emit('update:star',item)
			}
		}
	}
}
</script>

<style lang="scss" scoped>
.stars{
	display: flex;
	align-items: center;
	.star{
		margin-right: 10rpx;
	}
}
</style>