confirm
confirm fonksiyonu, <mdui-dialog> bileşeninin bir sarmalayıcısıdır. Bu fonksiyon, işlevsel olarak sistemin yerel window.confirm fonksiyonunun yerine kullanılmak üzere tasarlanmıştır. Bu fonksiyonu kullanarak, bileşenin HTML kodunu yazmanıza gerek kalmadan bir onay penceresi açabilirsiniz.
Kullanım
Fonksiyonu ihtiyacınıza göre içe aktarın:
import { confirm } from 'mdui/functions/confirm.js';
Kullanım örneği:
<mdui-button class="example-button">aç</mdui-button>
<script type="module">
import { confirm } from "mdui/functions/confirm.js";
const button = document.querySelector(".example-button");
button.addEventListener("click", () => {
confirm({
headline: "Onay Başlığı",
description: "Onay açıklaması",
confirmText: "TAMAM",
cancelText: "İptal",
onConfirm: () => console.log("onaylandı"),
onCancel: () => console.log("iptal edildi"),
});
});
</script>API
confirm(options: Options): Promise<void>
Fonksiyon bir Options nesnesini parametre olarak alır; dönüş değeri Promise'tir. Onay butonuna tıklanarak kapatılırsa Promise çözülür (resolve), diğer yollarla kapatılırsa Promise reddedilir (reject).
Options
| Öznitelik Adı | Tür | Varsayılan Değer |
|---|---|---|
headline |
string |
- |
| confirm'in başlığı | ||
description |
string |
- |
| confirm'in açıklama metni | ||
icon |
string |
- |
| confirm'in üst kısmındaki Material Icons simge adı | ||
closeOnEsc |
boolean |
false |
| ESC tuşuna basıldığında confirm'in kapatılıp kapatılmayacağı | ||
closeOnOverlayClick |
boolean |
false |
| Kaplama katmanına (overlay) tıklandığında confirm'in kapatılıp kapatılmayacağı | ||
confirmText |
string |
TAMAM |
| Onay butonunun metni | ||
cancelText |
string |
İptal |
| İptal butonunun metni | ||
stackedActions |
boolean |
false |
| Alt işlem butonlarının dikey olarak sıralanıp sıralanmayacağı | ||
queue |
string |
- |
|
Kuyruk adı. Varsayılan olarak kuyruk etkin değildir, fonksiyon birden çok kez çağrıldığında birden fazla confirm aynı anda gösterilir. Bu parametreye bir kuyruk adı girilebilir. Aynı kuyruk adına sahip confirm fonksiyonları, bir önceki confirm kapatıldıktan sonra bir sonraki confirm'i açar.
|
||
onConfirm |
(dialog: Dialog) => void | boolean | Promise<void> |
- |
|
Onay butonuna tıklandığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, Varsayılan olarak onay butonuna tıklandığında confirm kapanır; eğer dönüş değeri |
||
onCancel |
(dialog: Dialog) => void | boolean | Promise<void> |
- |
|
İptal butonuna tıklandığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, Varsayılan olarak iptal butonuna tıklandığında confirm kapanır; eğer dönüş değeri |
||
onOpen |
(dialog: Dialog) => void |
- |
|
confirm açılmaya başladığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, |
||
onOpened |
(dialog: Dialog) => void |
- |
|
confirm açılma animasyonu tamamlandığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, |
||
onClose |
(dialog: Dialog) => void |
- |
|
confirm kapanmaya başladığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, |
||
onClosed |
(dialog: Dialog) => void |
- |
|
confirm kapanma animasyonu tamamlandığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, |
||
onOverlayClick |
(dialog: Dialog) => void |
- |
|
Kaplama katmanına (overlay) tıklandığındaki geri çağırma fonksiyonu. Fonksiyon parametresi dialog örneğidir, |
||