Axiosコール直後にVueを更新するにはどうすればよいですか？

Question

私の変数this.xCtesPorRutaをaxios呼び出しの直後に更新する必要があります。そのため、選択肢のような要素にデータベースから情報を表示できます。 Axiosコールは、ボタンのv-on：clickイベントでアクティブ化されます。

私は変数にAxiosレスポンスを格納していますが、ただちに変更するのではなく、別の要素がクリックされたときにのみ変更します。私はnexttickで更新を強制しようとしていますが、成功しません。

初の試み：

var request = {rutas:this.xRutasSeleccionadas , tipos:this.xTipos} 
axios.post('/querys/', request).then(response => this.xCtesPorRuta = response.data) 

this.$nextTick(function() { 
    this.$forceUpdate(); 
}); 

私はVueの瞬時の配列を更新問題を持って知っているが、私はnextTick/forceUpdateハック続くスプライス方法を、使用して配列の変更を強制する前に、管理してきました。 Axiosコール後は決してしない。

編集：thisはここで間違って使用していました。その部分の助けを借りて@Demonyowhと@fraczに感謝します。

2回目の試行。結果は、最初のattempと同じである：

var myVar = this; 
var request = {rutas:this.xRutasSeleccionadas , tipos:this.xTipos} 
axios.post('/querys/', request).then(function (response) { 
    myVar.xCtesPorRuta = []; 
    for (var i=0; i<response.data.length; i++) { 
    myVar.xCtesPorRuta.splice(i, 1, response.data[i]); 
    } 
}) 

this.$nextTick(function() { 
    this.$forceUpdate(); 
}); 

は、この時間を助けていないspliceを使用してオンにします。

Answer 1

です！

「溶液」は、私がそれを必要と実際の選択にデータを使用していた：私は視覚的にページ上でそれらを表示する前にVUE-デベロッパーツール上の値を評価した

<select multiple class="form-control"> 
    <option v-for="cliente in xCtesPorRuta">@{{ cliente }} 
    </option> 
</select> 

。私はそれがうまく動かないと思ったので前進していませんでした。

Answer 2

...それはそれの中にあったので、axios.postを指し前thisがオブジェクトを参照していないので、これは..です何を行うことができ、変数はすぐに今更新さ

var myVar = this; 
var request = {rutas:this.xRutasSeleccionadas , tipos:this.xTipos} 
axios.post('/querys/', request).then(function (response) { 
    myVar.xCtesPorRuta = []; 
    for (var i=0; i<response.data.length; i++) { 
     myVar.xCtesPorRuta.splice(i, 1, response.data[i]); 
    } 
})