[Vuejs]-Show value name select javascript

0👍

Try this way instead:

<template>
    <div>
      <!-- Your select code -->
      <select id="select1" ref="seleccionado" v-model="id_equipo" required>
        <option
          v-for="equipo in equipos"
          :key="equipo.id_equipo"
          :value="equipo.id_equipo"
        >
          {{ equipo.nombre_equipo }}
        </option>
      </select>

      <!-- Your button code -->
      <v-btn
        color="blue darken-1"
        @click="addItem()"
      >
        Aregar Equipo
      </v-btn>

      <!-- Your table code -->
      <tbody>
        <tr
          v-for="item in rowData"
          :key="item.id_torneo"
        >
          <td>{{ item.id_torneo }}</td>
          <td>{{ item.id_equipo }}</td>
        </tr>
      </tbody>
    </div>
</template>

<script>
export default {
    methods: {
      addItem () {
        // Search the object in the equipos array with the selected id from the select
        let equipos_torneo = this.equipos.find(v.id_equipo === this.id_equipo);

        // If object gets found successfully, push to the rowData array
        if(equipos_torneo) this.rowData.push(equipos_torneo);
      },
    },
}
</script>

Leave a comment