App挂载

一、createApp挂载

import Dialog from './Dialog.vue';
import {createApp} from 'vue';

export const openDialog = () => {
  const div = document.createElement('div');
  document.body.appendChild(div);
  createApp(Dialog).mount(div);  //将Dialog挂载到div上
}

createApp接受第二个参数h

import Dialog from './Dialog.vue';
import {createApp, h} from 'vue';

export const openDialog = (options) => {
  const {title, content, ok, cancel,closeOnclickOverlay} = options;
  const div = document.createElement('div');
  document.body.appendChild(div);
  const app = createApp({
    render() {
      return h(Dialog, { //渲染Dialog并传参
        visible: true, 'onUpdate:visible': (newVisible) => {
          if (newVisible === false) {
            app.unmount(div); 
            div.remove();
          }
        },
      }, {title, content}); //插槽的参数
    }
  });
  app.mount(div);
};