Level 35
Try using the index from the loop
v-for="(cripto, index) in criptos">
{{ this.id_item_pagination + index }}
In saying that, shouldn't that info already be available to you in the pagination object? Look for 'from' and 'to'.
1 like
May 20, 2024
4
Level 3
How to number paging IDs continuously?
In short, I want to display an ID that goes from 1 to the last element of the pagination. So that page one has ID from 1 to 20, page two from 21 to 30 and so on.
It seems simple, but I've tried everything and it doesn't work.
My loop:
<tr class="odd:bg-fundo" v-for="cripto in criptos">
<td class="border-l border-borda p-4 text-center">{{ this.id_item_pagination + 1 }}</td>
<td class="border-l border-borda p-4 text-center">{{cripto.nome}} </td>
</td>
<script>
export default {
props: ['criptos','pagination'],
data () {
return {
id_item_pagination: this.pagination.from,
}
},
I simply store the "From" information of the data object as it tells me where to start the loop. But inside v-for I try to increment + 1, and it returns the same number in all. If it starts at 1, all lines come with the number 2.
Why is this happening if I am incrementing 1 with each loop iteration?
It seems simple, but I've been doing this for hours and I can't get anywhere.
Level 3
@Ben Taylor Thank you very much, I spent a lot of time trying, and even though I don't quite understand why your solution worked, I really appreciate your help.
Yes, I have "from" and "to", I thought it would be practical to scroll from From to the end.
thanks :)))
Level 35
@mvnobrega in Vue, when you do a for loop over an array of items (in your case the criptos), you can have access to the index of each item. This will start from 0 and increase by 1 for each item.
In the example above, we add the index to your id_item_pagination data attribute to get the actual record number for each item.
The way you were doing it was by adding 1 each time, which will always give you the same number for each record.
Does that make sense?
1 like
Level 3
@Ben Taylor thanks for the clarification.
Please or to participate in this conversation.