以v-model与promise两种方式实现vue弹窗组件-创新互联

最近公司有一个后台业务虽然也是写在了现有的后台系统中，但是之后要为这个业务单独拉出来新建一个后台系统,所以现有的后台系统中的vue组件库，就不能用了(因为不知道将来的系统要基于什么组件库，以防给未来移植项目带来麻烦),这次业务中又遇到了弹窗的功能,所以只能手动写一个了(虽然说弹窗组件很简单，也是想自己总结一下，有不对的地方也请指出)，一开始用传统的props,$emit但是觉得要接两个取消与确认的回调这块的逻辑分散了所以就用了promise两个回调的方式把两个回调写在了一起,并不一定好，算是提供一种思路吧。

一.概览

先看最后的调用方式

props $emit方式

  
slot的东西,想向弹窗中添加自定义的内容

methods: {
  display() {
   this.showModal = true;//交互点击手动触发显示弹窗 
  },
  onOK() {},//点击确认的回调
  onCancel() {}//点击取消的回调
}