how to use vuetify v-rating event? - vue.js

Question

in my template i build some v-rating component:
<div class="rating" v-for="rating in applicationViewCv.jobPostRatingFields" :key="rating.id">
<label :for="rating.id">
<b>{{rating.field}}</b>
</label>
<v-rating
#input="addRating(Number, rating.id)"
:value="rating.id"
background-color="indigo lighten-3"
color="indigo"
:dense="true"
:hover="true"
size="15"
:id="rating.id"
></v-rating>
</div>
I need to get the selected value in the event and pass it to addRating function.
now when i log the (Number) it passes to the function it returns:
ƒ Number() { [native code] }
and if i use Number() it always returns zero no matter what i have selected.
i tied to do this by documentation in the link below:
https://vuetifyjs.com/en/components/ratings
note: i cannot use v-model since the fields i want to get the rating of are dynamic hence i want to add an object for each field and push it into an array and send the array to the server

Answer 1

You can get the user selected rating value from input event, But instead of using Number, you should use
#input="addRating($event, rating.id)"
In methods
methods: {
addRating(value, id) {
console.log(value, id);
}
}
It prints the selected rating value along with the id
Working codepen here: https://codepen.io/chansv/pen/xxxPjNv?&editable=true&editors=101