Heim > Web-Frontend > js-Tutorial > Veröffentlichungsinhalt von art-dialog-vue2.0, einem Dialog-Plug-in basierend auf vue.js

Veröffentlichungsinhalt von art-dialog-vue2.0, einem Dialog-Plug-in basierend auf vue.js

不言
Freigeben: 2018-07-11 14:53:09
Original
2280 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich der Release-Inhalt von art-dialog-vue2.0 vorgestellt, ein auf vue.js basierendes Dialog-Plugin, das jetzt mit allen geteilt werden kann it

art-dialog-vue - Klassische und elegante Webdialogsteuerung

Vorteile

  1. Unterstützt normale und 12-direktionale Blasendialogfelder

  2. Unterstützung des ARIA-Standards

  3. Zukunftsorientiert: API basierend auf HTML5-Dialog

  4. Unterstützung von Standard- und modalem Dialog Boxen

  5. Umfangreiche und benutzerfreundliche Programmierschnittstelle

  6. Anpassbare Inhaltsgröße

Installation

 npm install art-dialog-vue //插件文件在plugin目录下
Nach dem Login kopieren

URL-Einführung

<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>
Nach dem Login kopieren

Modulare Einführung

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

Grundlegende Verwendung

const d = Vue.dialog({
    title: 'art-dialog-vue',
    content: {
              template: '<p>{{name}},欢迎使用</p>',
              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();
Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für das Lernen aller hilfreich sein wird. mehr Bitte beachten Sie die PHP-Chinese-Website für verwandte Inhalte!

Verwandte Empfehlungen:

Detailliertes Verständnis der JS-Testmethode für reguläre Ausdrücke und ihrer Fallstricke

Das obige ist der detaillierte Inhalt vonVeröffentlichungsinhalt von art-dialog-vue2.0, einem Dialog-Plug-in basierend auf vue.js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage