chat-app/src/components/x-message/useMessagePopup.js

import { createApp } from 'vue';
import MessagePopup from '@/components/x-message/index.vue'

export default function useMessagePopup() {
  function showMessage(obj) {
    const messageInstance = createApp(MessagePopup,{
      //监听消息关闭事件
      onAfterLeave:()=>{
        messageInstance.unmount();
        document.body.removeChild(mountNode);
      }
    });
    const mountNode = document.createElement('div');
    document.body.appendChild(mountNode);
    const vm = messageInstance.mount(mountNode);
    vm.showMessage(obj)
  }
  return { showMessage };
}