Rate 评分

用于评分

基础用法

通过 v-model 来绑定当前评分值。

Details

<template>
  <ARate v-model="rateValue"></ARate>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const rateValue = ref(3);
</script>

<style>

</style>

可自定义颜色

设置 color 属性可以设置选中时的颜色

Details

<template>
  <ARate v-model="rateValue" color="red"></ARate>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const rateValue = ref(4);
</script>

<style>

</style>

禁用状态

设置 disabled 来禁用评分。

Details

<template>
  <ARate v-model="rateValue" color="red" disabled></ARate>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const rateValue = ref(4);
</script>

<style>

</style>

自定义长度

设置 max 来定义评分的长度。

Details

<template>
  <ARate :max="10" v-model="rateValue" color="red"></ARate>
</template>

<script lang="ts" setup>
import { ref } from 'vue';

const rateValue = ref(7);
</script>

<style>

</style>

属性名	说明	类型	默认值
v-model	绑定的值	number	—
color	颜色	string	—
disabled	是否禁用	boolean	—
max	定义长度	boolean	—