Johannes Kraft
Johannes Kraft

Reputation: 257

Using select option as condition, Vuejs and vuetify

Hey there i'm trying to make a dropdown(v-select) change between two different things to show. In this example code the change is between two console.logs. When i run this code i need to pick one option two times before the method goes into the other statement. Why is this? And how can i fix this?

        <v-select
          v-model="category"
          :items="categories"
          item-text="text"
          item-value="value"
          single-line
          auto
          label="Filter"
          prepend-icon="search"
          @change="a();"
          >
        </v-select>


export default {
  data (){
    return {
      category: null,
      categories: [
        {
          value: 1,
          text: 'Arbete',
          selected: true
        },
        {  
          value: 2,
          text: 'Arbetare',
          selected: false
        }
      ]
     }

      },
      methods: {
        a (){

          if(this.category == 1){

           console.log("work  " + this.category)

        }else{
          console.log("labour  "+ this.category)
        }

      }
  }

Upvotes: 0

Views: 1125

Answers (1)

Traxo
Traxo

Reputation: 19022

use $nextTick

methods: {
     a() {
         this.$nextTick(() => {
             if (this.category == 1) {
                 console.log("work  " + this.category)
             } else {
                 console.log("labour  " + this.category)
             }
         })
     },
  }

Upvotes: 1

Related Questions