La idea es enumerar de forma consecutiva las filas de la tabla, he estado haciendo varias pruebas y leyendo la documentación, pero no he conseguido dar con la solución.
Os dejo un ejemplo funcional básico, a ver si me podéis orientar.
Gracias de antemano por vuestro tiempo.
var vm = new Vue({
el: '#tabla',
data: {
lista: {
"2":{"nombre":"Paco",},
"7":{"nombre":"Pedro",}
},
},
});
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.3/vue.min.js"></script>
Ejemplo:
<table id="tabla" class="table table-bordered">
<thead>
<tr>
<th>Número</th>
<th>Nombre</th>
</tr>
</thead>
<tbody>
<tr v-for="item in lista">
<td>X</td>
<td>{{ item.nombre }}</td>
</tr>
</tbody>
</table>
<hr>
Resultado esperado:
<table id="tabla" class="table table-bordered">
<thead>
<tr>
<th>Número</th>
<th>Nombre</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Paco</td>
</tr>
<tr>
<td>2</td>
<td>Pedro</td>
</tr>
</tbody>
</table>