应用实例

每个 Vue 应用都是通过 createApp 函数创建一个新的 应用实例

示例：

import { createApp } from 'vue'
const app = createApp({
  /* 根组件选项 */
})

根组件

跟组件是由createApp创建的组件。

挂载应用

1、调用.mount()方法，该方法参数可以是DOM 元素或是一个 CSS 选择器字符串。

示例：

<div id="app"></div>

app.mount('#app')

DOM 中的根组件模板

根组件的模板通常是组件本身的一部分，但也可以直接通过在挂载容器内编写模板来单独提供。当根组件没有设置 template 选项时，Vue 将自动使用容器的 innerHTML 作为模板。

示例

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

import { createApp } from 'vue'
const app = createApp({
  data() {
    return {
      count: 0
    }
  }
})

app.mount('#app')

应用配置

示例：

app.config.errorHandler = (err) => {
  /* 处理错误 */
}

多个应用实例

同一个页面中创建多个共存的 Vue 应用，而且每个应用都拥有自己的用于配置和全局资源的作用域。

示例：

const app1 = createApp({
  /* ... */
})
app1.mount('#container-1')

const app2 = createApp({
  /* ... */
})
app2.mount('#container-2')