毛老师的博客-gitee.io/mao-blogVue3优雅模态框封装方法-Vue3优雅模态框封装方法初探-实践Vue3优雅模态框封装方法-自定义最后一次我们谈到了使用虚拟节点和传送组件来制作模态框组件，并支持在模板中调用和在JavaScript中调用。但其实我们在工作中并不会花那么多精力在这些繁琐的工作上，一般直接使用组件库的弹出层进行修改（比如element-plus），但是涉及到的问题回到描述的重点通篇：不通用，调用起来不是很方便（比如我想在js/ts中使用，怎么办）结果是返回模板一一作为组件使用，但也不是不能解决。在第二章中，实现无非就是将一个vnode节点渲染成html，使用一些手段传递给destroy的方法给组件本身。经过长时间的积累...（布谷鸟，我做了unoverlay-vue，用于overlay层更简单方便的制作和二次封装，原理类似，就是用vuerender和closure来搞定销毁组件本身的方法给组件。这个工具可以用来：制作类似element-plus/naiveui/vuetifyjs/vant...的Message或Dialog支持同时调用两种方式（component/javascript-api）使用已有的组件库（如element-plus）来集成使用unoverlay-vue和自定义组件以element-plus@2.15.7(dialog)为例（也可以使用其他组件库）??安装pnpmaddunoverlay-vue#或者Yarnyarn在main中添加unoverlay-vue.js全局安装可以让所有的overlay都继承应用上下文(appContext)//main.jsimport{createApp}from'vue'importAppfrom'./App.vue'importunoverlayfrom'unoverlay-vue'constapp=createApp(App)app.use(unoverlay)app.mount('#app')自定义el-dialog组件
