基於vue.js的dialog插件art-dialog-vue2.0發佈

art-dialog-vue —— 經典、優雅的網頁對話框控件

優勢

1. 支持普通與 12 方向氣泡狀對話框
2. 支持 ARIA 標準
3. 面向將來：基於 HTML5 Dialog 的 API
4. 支持標準與模態對話框
5. 豐富且友好的編程接口
6. 能自適應內容尺寸

安裝

npm install art-dialog-vue //插件文件在plugin目錄下

url引入

<script src="plugin/dist/static/css/dialog.min.css"></script>
<script src="plugin/dist/static/js/dialog.js"></script>
<script>
    Vue.use(Dialog.default)//使用插件,注意以url引入時use的參數是Dialog.default
</script>

模塊化引入

import Dialog from 'art-dialog-vue' //esm
const Dialog = require('art-dialog-vue').default //RequireJS，非esm形式要加.default
Vue.use(Dialog)//使用插件

基本使用

const d = Vue.dialog({
    title: 'art-dialog-vue',
    content: {
              template: '<div>{{name}}，歡迎使用</div>',
              data() {
                  return {
                      name: 'hello'
                }
              }
    },
    button: [
     {
         id: '1',
         value: '肯定',
         callcack() {      
            //do something                                      
            return false;//返回false 表示彈窗不關閉
        }
     },
     {
         id: '2',
         value: '取消',
         callcack() {      
            //do something                                      
            return false;//返回false 表示彈窗不關閉
        }
     },
    ]
});
d.show();

詳細使用文檔請參考：https://leeseean.github.io/vu...，項目github地址：https://github.com/leeseean/v...（求star）