我如何訪問 v-for 上的數據？ VueJS + Quasar 框架

Question

我有以下代碼，它是一個 q-markup-table 從搜索查詢中獲取產品。 當表中填滿了來自查詢的產品時，我添加了一個按鈕來選擇一行，選定的行會將行數據發送到一個數組並將該數組發送到另一個名為“選定產品”的表，但是我怎樣才能訪問v-for 數據（即：producto.nombre）將其發送到新數組？

  <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>

Answer 1

將產品傳遞給agregarProducto ，像這樣......

@click="agregarProducto(producto)"

將完整對象添加到選擇...

methods: {
  agregarProducto(producto) {
    this.selectedProducts.push(producto);
    // see?
    console.log('first price is', this.selectedProducts[0].precio);
  }