msg alert

Nachrichtenalarm

Eine einfache Blasennachrichten-Eingabeaufforderungsbibliothek, nur 3 KB

Nachahmung der Element-UI-Message-Komponente, die jedoch nur auf Vue.js angewendet werden kann. Daher kann ich nicht sagen, dass sie zu 100 % identisch ist mindestens 90 % ähnlich sein, wenn es Raum für Optimierung gibt, ist PR willkommen?

Installieren

Verwenden Sie npm:

npm install msg-alert --save

Mit CDN:

 < script src =" https://cdn.jsdelivr.net/npm/msg-alert " > </ script > 

Wie zu verwenden

Weitere Informationen finden Sie im Warehouse unter public/index.html

ESModule-Modul

 import message from 'msg-alert'
// 使用方法如下浏览器使用示例

CommonJS-Modul

 const message = require ( 'msg-alert' )
// 使用方法如下浏览器使用示例

Verwendung im Browser

 < script src =" https://cdn.jsdelivr.net/npm/msg-alert " > </ script >
< script >
  // 默认 等价 message({type:'info',text:'这是一个段落'})
  message ( '这是一个段落' )
  message . info ( '这是一个段落' )
  // 成功 等价 message({type:'success',text:'success'})
  message . success ( 'success' )
  // 警告 等价 message({type:'warn',text:'warn'})
  message . warn ( 'warn' )
  // 错误 等价 message({type:'error',text:'error'})
  message . error ( 'error' )
</ script > 

Options-API

message.zIndex

Typ: Number

Standardwert: 1

Anzeigeebene der Nachricht (global)

message.destroyAll

Typ: Function

Zerstöre alle Nachrichten

Typ

Typ: String

Standardwert: info

Art der Nachrichtenanzeige

Text

Typ: String

Standardwert: ''

Inhalt der Nachrichtenanzeige

zIndex

Typ: Number

Standardwert: 1

Anzeigeebene der Nachricht (derzeit eingeblendet)

versetzt

Typ: Number

Standardwert: 20

Nachrichtenversatz vom oberen Rand des Fensters

Dauer

Typ: Number

Standardwert: 3000

Dauer der Nachrichtenanzeige, auf 0 gesetzt, um nie zu schließen (Einheit: Millisekunden)

benutzerdefinierteKlasse

Typ: String

Standardwert: ''

Passen Sie den Klassennamen von Message an

html

Typ: Boolean

Standardwert: false

Ob das text als HTML-Fragment verarbeitet werden soll (bitte bereiten Sie die xss-ähnliche Verarbeitung im Voraus vor)

anzeigenSchließen

Typ: Boolean

Standardwert: false

Ob eine Schließen-Schaltfläche angezeigt werden soll

onClose

Typ: Function

Standardwert: -

Rückruffunktion, bevor die Nachricht geschlossen wird

appendTo

Typ: String | HTMLElement

Standardwert: document.body

Legen Sie den Root-Element-Link der Komponente fest