I have the following code, it's a q-markup-table to get products from a search query. When the table gets filled with products from the query I added a button to select one row, the selected row will send the row data to an array and send that array to another table called "selected products", but how can I acces to the v-for data (i.e: producto.nombre) to send it to the new array?
<q-markup-table flat bordered separator="cell">
<thead class="bg-blue-grey-1">
<tr>
<th class="text-left">Nombre</th>
<th class="text-right">Descripcion</th>
<th class="text-right">Precio</th>
<th></th>
</tr>
</thead>
<tbody v-for="producto in productos" :key="producto.producto_id">
<tr>
<td class="text-left">{{ producto.nombre }}</td>
<td class="text-right">{{ producto.descripcion }}</td>
<td class="text-right">{{ "$" + producto.precio }}</td>
<td class="text-right">
<q-btn
flat
class="text-primary"
label="Seleccionar"
@click="agregarProducto"
></q-btn>
</td>
</tr>
</tbody>
</q-markup-table>
Pass the product to agregarProducto, like this...
@click="agregarProducto(producto)"
Add the complete object to the selection...
methods: {
agregarProducto(producto) {
this.selectedProducts.push(producto);
// see?
console.log('first price is', this.selectedProducts[0].precio);
}