今天给大家分享的是Vue3系列之自定义桌面端对话框组件v3layer。
![a2a276bf75f29412a2e106a9c74972dd.png](https://img-blog.csdnimg.cn/img_convert/a2a276bf75f29412a2e106a9c74972dd.png)
V3Layer 基于vue3.0构建的多功能PC网页端弹窗组件。拥有超过10+种弹窗类型、30+种参数配置,支持拖拽(自定义拖拽区域)、缩放、最大化、全屏及自定义置顶层叠等功能。
![6c1522069a005649695ee8eefdacceff.gif](https://img-blog.csdnimg.cn/img_convert/6c1522069a005649695ee8eefdacceff.gif)
快速引入
在main.js中引入v3layer组件。
import { createApp } from 'vue'import App from './App.vue'// 引入Element-Plus组件库import ElementPlus from 'element-plus'import 'element-plus/lib/theme-chalk/index.css'// 引入弹窗组件v3layerimport V3Layer from './components/v3layer'createApp(App).use(ElementPlus).use(V3Layer).mount('#app')
![d172ea276c0b49fe4381444494875fb9.gif](https://img-blog.csdnimg.cn/img_convert/d172ea276c0b49fe4381444494875fb9.gif)
v3layer支持组件式+函数式两种调用方式。
- 组件式
这里是自定义插槽内容信息!
- 函数式
let $el = v3layer({ title: