v-rating component is a specialized but important piece in building user widgets. Collecting user feedback via ratings is a simple analytic that can provide a lot of feedback to your product or application.
v-rating component provides a simple interface for gathering user feedback.
v-rating component can be colored as you want, you can set both selected and not selected colors.
Control the space occupied by
v-rating items using the density prop.
Clicking on a current rating value can reset the rating by using clearable prop.
For ratings that are not meant to be changed you can use readonly prop.
When using the hover prop, the rating icons will become a solid color and slightly increase its scale when the mouse is hovered over them.
v-rating component can display labels above or below each item.
You can use custom icons.
Change the number of items by modifying the the length prop.
The half-increments prop increases the granularity of the ratings, allow for
.5 values as well.
Utilize the same sizing classes available in
v-icon or provide your own with the size prop.
Provide a label to assistive technologies for each item.
Slots enable advanced customization possibilities and provide you with more freedom in how you display the rating.
Custom labels slot
Any arbitrary content could be displayed for labels in item-label slot.
The rating component pairs well with products allowing you to gather and display customer feedback.