alert

Funkcja alert jest wygodną nakładką na komponent <mdui-dialog>. Funkcja ta służy jako zamiennik natywnej funkcji window.alert. Dzięki niej nie musisz pisać kodu HTML komponentu, aby otworzyć okno alarmowe.

Sposób użycia

Zaimportuj funkcję:

import { alert } from 'mdui/functions/alert.js';

Przykład użycia:

otwórz

<mdui-button class="example-button">otwórz</mdui-button>

<script type="module">
  import { alert } from "mdui/functions/alert.js";

  const button = document.querySelector(".example-button");

  button.addEventListener("click", () => {
    alert({
      headline: "Tytuł alarmu",
      description: "Opis alarmu",
      confirmText: "OK",
      onConfirm: () => console.log("potwierdzono"),
    });
  });
</script>

API

alert(options: Options): Promise<void>

Funkcja alert przyjmuje obiekt Options jako parametr; zwraca Promise. Jeśli okno alarmowe zostanie zamknięte przez kliknięcie przycisku potwierdzenia, Promise zostanie rozwiązane (resolve). Jeśli zostanie zamknięte w inny sposób, Promise zostanie odrzucone (reject).

Options

Nazwa	Typ	Wartość domyślna
`headline`	`string`	-
Tytuł okna alert
`description`	`string`	-
Tekst opisu okna alert
`icon`	`string`	-
Nazwa ikony Material Icons na górze okna alert
`closeOnEsc`	`boolean`	`false`
Czy zamknąć okno alert po naciśnięciu klawisza ESC
`closeOnOverlayClick`	`boolean`	`false`
Czy zamknąć okno alert po kliknięciu na nakładkę
`confirmText`	`string`	`OK`
Tekst przycisku potwierdzenia
`queue`	`string`	-
Nazwa kolejki. Domyślnie kolejka nie jest włączona. Przy wielokrotnym wywołaniu funkcji wiele okien alert będzie wyświetlanych jednocześnie. Możesz podać nazwę kolejki. Funkcje alert o tej samej nazwie kolejki będą otwierane jedno po drugim – następne zostanie otwarte po zamknięciu poprzedniego. `dialog()`, `alert()`, `confirm()`, `prompt()` – jeśli mają tę samą nazwę kolejki, będą współdzielić kolejkę.
`onConfirm`	`(dialog: Dialog) => void \| boolean \| Promise<void>`	-
Funkcja zwrotna wywoływana po kliknięciu przycisku potwierdzenia. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego. Domyślnie po kliknięciu przycisku potwierdzenia okno alert zostanie zamknięte. Jeśli funkcja zwróci `false`, okno nie zostanie zamknięte. Jeśli zwróci Promise, okno zostanie zamknięte po rozwiązaniu tego Promise.
`onOpen`	`(dialog: Dialog) => void`	-
Funkcja zwrotna wywoływana na początku otwierania okna alert. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego.
`onOpened`	`(dialog: Dialog) => void`	-
Funkcja zwrotna wywoływana po zakończeniu animacji otwierania okna alert. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego.
`onClose`	`(dialog: Dialog) => void`	-
Funkcja zwrotna wywoływana na początku zamykania okna alert. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego.
`onClosed`	`(dialog: Dialog) => void`	-
Funkcja zwrotna wywoływana po zakończeniu animacji zamykania okna alert. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego.
`onOverlayClick`	`(dialog: Dialog) => void`	-
Funkcja zwrotna wywoływana po kliknięciu na nakładkę. Parametr funkcji to instancja okna dialogowego, `this` również wskazuje na instancję okna dialogowego.

Poprzedni rozdział

dialog

Następny rozdział

confirm