my-vue-dialog

简称MyDailog，是一个基于Vue 模态对话框控件，主要有如下特点：

特点

• 编程式的对话框创建
• 使用动态组件创建对话框
• 提供对话框关闭验证
• 更好的对话框编程体验

兼容性

Vue版本兼容性

目前MyDailog仅兼容版本2.5.0及以上的Vue。

浏览器兼容性

IE	edge	Chrome	safari	firefox	android	IOS
>= 9	√	√	√	√	>= 4.4	>= 9.0

使用文档

请参考https://laden666666.github.io/my-vue-dialog/

源码

github ，码云

安装

CDN 引入

通过unpkg.com/my-vue-dialog 可以访问MyDailog最新版本的资源，在页面上引入js和css文件即可开始使用：

<!-- import Vue.js -->
<script src="//vuejs.org/js/vue.min.js"></script>
<!-- import stylesheet -->
<link rel="stylesheet" href="//unpkg.com/[email protected]/dist/my-vue-dialog.css">
<!-- import my-vue-dialog -->
<script src="unpkg.com/my-vue-dialog"></script>

npm和webpack引入

执行：

npm install my-vue-dialog -S

然后在webpack环境中引入

import MyDialog from 'my-vue-dialog'
import 'my-vue-dialog/dist/my-vue-dialog.css'

初始化

先使用Vue.use引入控件的插件，在创建vue的时候，使用myDialog属性，声明使用控件。例：

import Vue from 'vue'
import MyDialogPlugin from 'my-vue-dialog'
import 'my-vue-dialog/dist/my-vue-dialog.css'

vue.use(MyDialogPlugin)

new Vue({
    el: '#app',
    template: '...',
    // 使用myDialog属性，声明使用控
    myDialog: {}
})

注意：如果new Vue时候未设置myDialog，My-Vue-Dialog将无法使用。