vuejs zeigt den Wert innerhalb von {{ }} nicht an, der Text wird unverändert angezeigt

Question

Ich habe ein VueJS-Programm entwickelt und den Befehl npxserve ausgeführt. Ich gehe in dieses Verzeichnis und führe npxserve aus. Ich durchsuche http://localhost:300/myvuefile.html und erhalte nur die folgende Ausgabe. {{count}} innerhalb der Schaltfläche. Mein Code:

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script> ;

<div id="app">
  <button @click="count++">{{ count }}</button>
</div>

<script>
{createApp} aus 'vue' importieren

const app = createApp({
  Daten() {
    zurückkehren {
      Anzahl: 0
    }
  }
})

app.mount('#app')
</script>

Ich muss den Wert der Zählung erhalten und beim Klicken sollte die Zählung erhöht werden. Stattdessen erhalte ich nur {{count}} als Ausgabe. Bitte helfen Sie, dieses Problem zu lösen.

Answer 1

根据文档-

所以，要么像这样使用-

const app = Vue.createApp({
  data() {
    return {
      count: 0
    }
  }
})

app.mount('#app')

<div id="app">
  <button @click="count++">{{ count }}</button>
</div>

<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>