how can get index & count in vuejs

Question

I have code like this (JSFiddle)

  <li v-for="(itemObjKey, catalog) in catalogs">this index : {{itemObjKey}}</li> 

Output:
this index: 0
this index: 1

My question is:

1. How can I get value index first begin: 1 for example
   I want output like this:
   this index: 1
   this index: 2
   
   
2. How can I get count from index, i.e. output like this:
   this index: 1
   this index: 2
   this count: 2 field
   

Answer 1

you can just add 1

<li v-for="(catalog, itemObjKey) in catalogs">this index : {{itemObjKey + 1}}</li> 

to get the length of an array/objects

{{ catalogs.length }} 

Answer 2

In case, your data is in the following structure, you get string as an index

items = {    am:"Amharic",    ar:"Arabic",    az:"Azerbaijani",    ba:"Bashkir",    be:"Belarusian" } 

In this case, you can use extra variable to get the index in number:

<ul>   <li v-for="(item, key, index) in items">     {{ item }} - {{ key }} - {{ index }}   </li> </ul> 

Source: https://alligator.io/vuejs/iterating-v-for/