组件实例

插件一个应用实例

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

import { createApp } from 'vue'

const app = createApp({})

根组件

const RootComponent = {
  /* 选项 */
}
const app = Vue.createApp(RootComponent)
const vm = app.mount('#app')

import { Component, ComponentPublicInstance, createApp, h } from 'vue'

/**
 * 将组件挂载到 body 中
 * @param rootComponent 组件
 */
function mountComponent(rootComponent: Component) {
  const app = createApp(rootComponent)
  const root = document.createElement('div')

  document.body.appendChild(root)

  return {
    instance: app.mount(root),
    unmount() {
      app.unmount()
      document.body.removeChild(root)
    },
  }
}

let instance: ComponentPublicInstance | null = null

function initInstance() {
  const Wrapper: Component = {
    setup() {
      const { state } = useModalState()

      return () => h(Modal, state)
    },
  }

  !({ instance } = mountComponent(Wrapper))
}