Home > OS >  Vue if statement while display data from api
Vue if statement while display data from api

Time:12-20

I am getting some data from an Api and I want to check if the vtype is "car". Here is how I loop :

<tr v-for="vehicles_group in vehicles_groups.data" :key="vehicles_group.gid">
      <td>
           <input type="checkbox">
      </td>
      <!-- <td>{{ vehicles_groups.gid }} </td> -->
      <td>{{ vehicles_group.title }}</td>
      <td>{{ vehicles_group.vtype }}</td>
      <td>{{ vehicles_group.company }}</td>
      <td>{{ vehicles_group.active }}</td>
      <td>{{ vehicles_group.priceincludes }}</td>
      <td>{{ vehicles_group.categories }}</td>
      <td>{{ vehicles_group.earlybook }}</td>
      <td>{{ vehicles_group.earlybook }}</td>
 </tr>

Is there a way in vue to check if the value of a Api output is car console something?

For example

if {{ vehicles_group.vtype }} == car{
   console.log('its a car', vehicles_group.vtype )
}

CodePudding user response:

Sure.

If you want to use v-if in your template:

<td v-if="vehicles_group.vtype == 'car'">
    It's a car
</td>
<td v-else>
    It's not a car
</td>

If you want to this in your component JavaScript code, you can do it as usual:

if (vehicles_group.vtype == "car") {
   console.log('its a car', vehicles_group.vtype )
}
  • Related