confirm

La funzione confirm è un wrapper per il componente <mdui-dialog> e sostituisce la funzione nativa window.confirm. Con questa funzione, puoi aprire un dialogo di conferma senza scrivere alcun HTML per il componente.

Utilizzo

Importa la funzione:

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

Esempio:

apri

<mdui-button class="example-button">apri</mdui-button>

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

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

  button.addEventListener("click", () => {
    confirm({
      headline: "Titolo Conferma",
      description: "Descrizione conferma",
      confirmText: "OK",
      cancelText: "Annulla",
      onConfirm: () => console.log("confermato"),
      onCancel: () => console.log("annullato"),
    });
  });
</script>

API

confirm(options: Options): Promise<void>

La funzione accetta un oggetto Options come parametro e restituisce una Promise. Se il dialogo viene chiuso facendo clic sul pulsante di conferma, la Promise viene risolta. Se il dialogo viene chiuso in qualsiasi altro modo, la Promise viene respinta.

Options

Proprietà	Tipo	Predefinito
`headline`	`string`	-
Il titolo del dialogo.
`description`	`string`	-
La descrizione del dialogo.
`icon`	`string`	-
Il nome dell'Icona Material visualizzata nella parte superiore del dialogo.
`closeOnEsc`	`boolean`	`false`
Indica se il dialogo può essere chiuso premendo il tasto Esc. Se impostato su `true`, il dialogo si chiude quando viene premuto il tasto Esc.
`closeOnOverlayClick`	`boolean`	`false`
Indica se il dialogo può essere chiuso cliccando sullo sfondo.
`confirmText`	`string`	`OK`
Il testo per il pulsante di conferma.
`cancelText`	`string`	`Annulla`
Il testo per il pulsante di annullamento.
`stackedActions`	`boolean`	`false`
Indica se impilare verticalmente i pulsanti di azione inferiori.
`queue`	`string`	-
Il nome della coda. Per impostazione predefinita, la coda è disabilitata. Se questa funzione viene invocata più volte, verranno visualizzati più dialoghi contemporaneamente. Se viene fornito un nome di coda, i dialoghi con lo stesso nome di coda si apriranno in sequenza, ciascuno dopo la chiusura del precedente. Le funzioni `dialog()`, `alert()`, `confirm()` e `prompt()` condividono la stessa coda se i loro nomi di coda corrispondono.
`onConfirm`	`(dialog: Dialog) => void \| boolean \| Promise<void>`	-
La callback si attiva quando fai clic sul pulsante di conferma. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo. Per impostazione predefinita, un clic sul pulsante di conferma chiude il dialogo. Se il valore restituito è `false`, il dialogo rimane aperto. Se il valore restituito è una promise, il dialogo si chiude dopo che la promise viene risolta.
`onCancel`	`(dialog: Dialog) => void \| boolean \| Promise<void>`	-
La callback si attiva quando fai clic sul pulsante di annullamento. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo. Per impostazione predefinita, un clic sul pulsante di annullamento chiude il dialogo. Se il valore restituito è `false`, il dialogo rimane aperto. Se il valore restituito è una promise, il dialogo si chiude dopo che la promise viene risolta.
`onOpen`	`(dialog: Dialog) => void`	-
La callback si attiva quando il dialogo inizia ad aprirsi. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo.
`onOpened`	`(dialog: Dialog) => void`	-
La callback si attiva quando l'animazione di apertura del dialogo è completata. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo.
`onClose`	`(dialog: Dialog) => void`	-
La callback si attiva quando il dialogo inizia a chiudersi. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo.
`onClosed`	`(dialog: Dialog) => void`	-
La callback si attiva quando l'animazione di chiusura del dialogo è completata. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo.
`onOverlayClick`	`(dialog: Dialog) => void`	-
La callback si attiva quando fai clic sullo sfondo. La funzione riceve l'istanza del dialogo come parametro e `this` fa riferimento alla stessa istanza del dialogo.

Capitolo precedente

alert

Capitolo successivo

prompt