Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/vinayakkulkarni/v-rating
:star: Rating component in Semantic-UI made with VueJS (< 1kB, blazing fast)
https://github.com/vinayakkulkarni/v-rating
v-rating vue vue-components vue-rating vue-semantic-ui-rating vue2 vuejs vuejs-components vuejs2
Last synced: about 1 month ago
JSON representation
:star: Rating component in Semantic-UI made with VueJS (< 1kB, blazing fast)
- Host: GitHub
- URL: https://github.com/vinayakkulkarni/v-rating
- Owner: vinayakkulkarni
- License: mit
- Created: 2017-11-28T22:36:32.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2024-03-24T20:41:31.000Z (9 months ago)
- Last Synced: 2024-10-30T09:35:58.138Z (about 1 month ago)
- Topics: v-rating, vue, vue-components, vue-rating, vue-semantic-ui-rating, vue2, vuejs, vuejs-components, vuejs2
- Language: JavaScript
- Homepage: https://bit.ly/v-rating
- Size: 2.73 MB
- Stars: 49
- Watchers: 3
- Forks: 5
- Open Issues: 19
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-blazingly-fast - v-rating - :star: Rating component in Semantic-UI made with VueJS (< 1kB, blazing fast) (JavaScript)
README
# V-Rating :zap: [![Build Status](https://travis-ci.org/vinayakkulkarni/v-rating.svg?branch=master)](https://travis-ci.org/vinayakkulkarni/v-rating) [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-rating.svg?type=shield)](https://app.fossa.io/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-rating?ref=badge_shield)
+ Simple `ui rating` component for Vue made with Semantic-UI.
+ This is [on GitHub](https://github.com/vinayakkulkarni/v-rating) so let me know if I've b0rked it somewhere, give me a star :star: if you like it :beers:
+ Demo here -> [💯 Codesandbox Link](http://bit.ly/v-rating)
## Requirements* [Vue.js](https://vuejs.org/) 2.x
* [Semantic-UI](https://semantic-ui.com/) 2.x## :white_check_mark: Install :ok_hand:
```bash
npm install v-rating
// or
yarn add v-rating
```CDN: [UNPKG](https://unpkg.com/v-rating/dist/) | [jsDelivr](https://cdn.jsdelivr.net/npm/v-rating/dist/) (available as `window.VRating`)
## :white_check_mark: Usage :mortar_board:
Register the component globally:
```javascript
Vue.component('Rating', require('v-rating'));
```
Or use locally
```javascript
import Rating from 'v-rating';
```## :white_check_mark: Example 1 :four_leaf_clover:
```html
```
```javascript
Vue.component('example-component', {
data() {
return {
yourLocalVariable: 0,
};
}
});
```### :white_check_mark: :book: Props
| Name | Type | Required? | Default | Description |
| --- | --- | --- | --- | --- |
| `type` | String | No | `star` | The type of rating component will it be? SUI has `stars` &`heart`. |
| `clearable` | Boolean | No | `true` | Whether the rating is clearable or not. [Read the SUI Docs on this](https://semantic-ui.com/modules/rating.html#/settings) |
| `max` | String | No | `5` | A number representing the maximum ratings that can be made available. |
| `initial` | String | No | `0` | A number representing the default rating to apply. |## NPM :octocat:
[![NPM](https://nodei.co/npm/v-rating.png?downloads=true&downloadRank=true&stars=true)](https://nodei.co/npm/v-rating/)
## License
[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-rating.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fvinayakkulkarni%2Fv-rating?ref=badge_large)