如何用Vue编写一个命令式风格的弹窗组件？

本文共计929个文字，预计阅读时间需要4分钟。

前言：在日常工作中，弹窗组件是非常常用的组件，但使用起来还是有不少人感到困惑。空闲时间自己简单实现了一个弹窗组件，包括以下知识点：extend、$mount、$el。使用方式：this.$Confirm({ title: '自定义' });

前言

在日常工作中弹窗组件是很常用的组件，但用得多还是别人的，空闲时间就自己来简单实现一个弹窗组件

涉及知识点：extend、$mount、$el

使用方式：

this.$Confirm({ title:'自定义标题' }).then(res=>{ console.log(res) })

目录结构

index.vue：组件布局、样式、交互逻辑

index.js：挂载组件、暴露方法

知识点

在此之前，了解下涉及的知识点

1. extend

使用这个api，可以将引入的vue组件变成vue构造函数，实例化后方便进行扩展

2. $mount

我们希望弹窗组件是在使用时才显示出来，那么就需要动态的向body中添加元素。