Appearance
wiz-star-rating
wiz-star-rating is a reusable Vue.js component designed to display a 5-star rating system with customizable images and links for each star. The component is responsive and provides flexibility with default or custom icon. You can configure images for the component items.
Learn more about components
Usage
Markup:
vue
<wiz-star-rating></wiz-star-rating>To assign custom images instead of the stars:
vue
<wiz-star-rating
:images="{
link01: 'https://example.com/star01.png',
link02: 'https://example.com/star02.png',
link03: 'https://example.com/star03.png',
link04: 'https://example.com/star04.png',
link05: 'https://example.com/star05.png',
}"
/>Properties
The following properties are available:
| Property | Type | Default value | Description |
|---|---|---|---|
images | object | {} | An object of custom image URLs or paths to override the default star icons. Keys must match "link01", "link02", "link03", "link04", "link05". |
link01-05 | string | https://viseven.com | Target URLs for the "link01", "link02", "link03", "link03", "link04", and "link05". Links the image to a target webpage. |
Limitations
The structure of wiz-star-rating is fixed to display five images in a row.