title: Bootstrap vue select sending old value
body: <p>I got this select code based on vue bootstrap:</p>
  
  <pre><code>&lt;b-form-select v-model="selectedgroup" class="mb-3"  @change="searchSubGroup()"&gt;
      &lt;option :value="null"&gt;Select a group&lt;/option&gt;
      &lt;option v-for="group in groupItem" :value="group.id"&gt;
          {{group.nome}}
      &lt;/option&gt;
  &lt;/b-form-select&gt;  
  </code></pre>
  
  <p>When the <code>searchSubGroup()</code> method is called by @change event, the @change event pass a old value of <code>selectedgroup</code>. Example: If i click in option with value = 1 first, the method will call <code>selectedgroup</code> as <code>null</code>, then if i click again in another option with value = 2, the method will call <code>selectedgroup</code> as 1.</p>
  
  <pre><code>searchSubGroup(){ 
    this.axios.get("http://chart.solutions/public/api/produto/subgroup/search/" + this.selectedgroup + "/").then(response =&gt; {
          if (response.data.erro) {
              //console.log("subgroup doesnt exist")
          }else{
              this.subGroupItem = response.data;
          }
      })
  } 
  </code></pre>