Vue Js v-model on v-select shows wrong value

Question

There is some kind of bug on my v-select that causes v-model to display a different value than the actual value of the variable. I use a method to change the selected option that applies to the first change. For example, if I select False and flag = Y, the selected option changes to True, this works the first time you select the option, then when I change the value from True to False, it changes value, but the selected option is still false.

<v-col cols="9">
      <v-select
           v-model="promo_form.generate_voucher"
           @input="methodUsed"
           :rules="textInputRules"
           :items="['False', 'True']"
           required
           outlined
      ></v-select>
</v-col>

This is the method I use:

if(this.flag_member == 'N' && this.promo_form.generate_voucher == 'True'){
     this.promo_form.promo_id = null;
     this.flag_member = "";
     this.promo_form.generate_voucher = null;
     this.promo_form.voucher_type = "";
     this.flag1 = 'y';
}
else if(this.flag_member == 'Y' && this.promo_form.generate_voucher == "False"){
     this.promo_form.generate_voucher = "True";
     this.flag1 = 'n'
}

if(this.flag1 == 'y'){
     alert('Something')
}
else if(this.flag1 == 'n'){
     alert("Something")
}

I tried adding a label and the value is correct for the label but not for the v-model

Answer 1

In the method try changing this line

this.promo_form.generate_voucher = null

to

this.promo_form.generate_voucher = 'False'