search

Home  >  Q&A  >  body text

Vue.js 3 - No instances of components, really?

<p>In Vue 2, you can create a reactive instance without components, like this: </p> <pre class="brush:php;toolbar:false;">var vue = new Vue({ el: '#root', data: { /*... */ }, methods: { /* ... */ } })</pre> <p>In fact, this is the basic usage pattern introduced at the beginning of the Vue 2 documentation. </p> <p>I think this is a very elegant way to add responsiveness to existing DOM elements, and the instances created are easy to manipulate programmatically. Is there an equivalent method in Vue 3? </p>
P粉790819727P粉790819727449 days ago572

reply all(1)I'll reply

  • P粉293550575

    P粉2935505752023-09-05 10:43:04

    Use 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>

    reply
    0
  • Cancelreply