1
Ich bin in meinem Kopf gemischt: Ich weiß nicht, warum ich irgendwo sehe, dass wir this in Vue.js Vorlage verwenden können. Jetzt weiß ich nicht, was ich benutzen muss.Verwenden Sie 'dies' in Vue Vorlage?
ich einige Fälle testen hier:
new Vue({
el: "#app",
data: function() {
\t return {
\t myVar: 'test'
}
},
methods: {
returnText: function() {
\t console.log('methods returnText !');
return 'return text from methods !';
}
},
computed: {
computedProp: function() {
\t return 'computed !';
}
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.5/vue.js"></script>
<div id="app">
{{ this.myVar }}<br><!-- this works -->
{{ myVar }}<br><!-- this works -->
<button @click="myVar = 'test without this !'" type="button">
Change text</button><!-- this works --><br>
<button @click="this.myVar = 'test with this !'" type="button">
Change text (not working because of 'this')</button><!-- this NOT works -->
<br><br>
{{ computedProp }} <!-- this works -->
<br>
{{ this.computedProp }} <!-- this works -->
<br><br>
{{ returnText() }} <!-- this works -->
<br>
{{ this.returnText() }} <!-- this works -->
</div>Was ist die Empfehlung?
nicht mit 'this' ist derjenige, den ich überall sehe, und warum Typ 5 Zeichen mehr, wenn das Ergebnis gleich ist. :) –
Zumindest in einigen Fällen verursacht 'this' Probleme, wie Sie bemerkt haben. Ein anderer Ort, den ich gefunden habe, ist "v-for". Mit Vuex kann man 'this. $ Store ...' nicht innerhalb 'v-for' machen, aber' $ store ... 'funktioniert gut. Daher ist die Empfehlung, "dieses" nicht zu verwenden, vernünftig. –