Vue.js 3 – Eigentlich keine Instanzen von Komponenten?

Question

In Vue 2 können Sie eine reaktive Instanz ohne Komponenten erstellen, wie folgt:

var vue = new Vue({
    el: '#root',
    Daten: { /*... */ },
    Methoden: { /* ... */ }
})

Tatsächlich ist dies das grundlegende Verwendungsmuster, das zu Beginn der Vue 2-Dokumentation eingeführt wurde.

Ich denke, dass dies eine sehr elegante Möglichkeit ist, vorhandenen DOM-Elementen mehr Reaktionsfähigkeit zu verleihen, und die erstellten Instanzen lassen sich leicht programmgesteuert bearbeiten. Gibt es eine entsprechende Methode in Vue 3?

Answer 1

使用CDN

// CDN Vue Import
const { createApp, ref } = Vue

const app = createApp({
  setup() {
    const msg = ref("hello world")
    
    return { msg }
  },
}).mount('#app')

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

<div id="app">
   <div>{{ msg }}</div>
   <input v-model="msg" />
</div>