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 2 months 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 (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2024-03-24T20:41:31.000Z (6 months ago)
• Last Synced: 2024-07-13T23:22:51.879Z (2 months 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)