SRatingComponent

This component represent a simple rating "stars" based component. You can as well choose the icon you want to use, the number of them, etc...

Platform  
html
   â”‚    Support  
Chromium supported
Firefox supported
Safari supported
Edge supported
Since  2.0.0
   â”‚   
Olivier Bossel
Olivier Bossel
   â”‚   
beta

  Preview

Simple rating

 

Loading code example. Please wait...

More stars

 

Loading code example. Please wait...

Different icon and color

 

Loading code example. Please wait...

Changing size

 

Loading code example. Please wait...

  Features

  Import

  Install

  Events

  1. s-rating.change

    Dispatched when the rating has been updated

  2. s-rating

    Dispatched for every events of this component. Check the detail.eventType prop for event type

  Interface

  1. name
    rate
    String

    Specify a name that will be attributed to the hidden input created automatically

  2. value
    3
    Number

    Specify a base value for the rating

  3. min
    1
    Number

    Specify the minimum rate you accept

  4. max
    5
    Number

    Specify the maximum rate you accept

  5. icon
    star
    String

    This works only if you use the "s-icon:..." class notation. Define the icon you want to use

  6. iconClass
    String

    Specify a custom icon class you want to use. If this is set, override the "icon" parameter

  7. readonly
    false
    Boolean

    Specify if you want your rating component to just display the value and that the user cannot interact with it or not

Bugs
are not our friends...

Don't hesitate to declare an issue if something does not works as expected.

Declare my issue on Github Talk about it on Discord

The more we are,
the stronger we become.

Don't hesitate to tell some words to you friends about us. The goal is to became more and more each days to help each others...

Support us on Patreon! Share on Facebook! Make a tweet!

The more we are,
the stronger we become.

Don't be afraid to join us on Discord.

Join us on discord!

We love,
Open source!

All of our codebase can be found on Github. We hope that you may contribute to help us make our tools even better!

Discover our codebase!

Welcome on