Reemplazo de alerta de JavaScript nativo hermoso-alerta dulce
| Autor: | t4t5 |
|---|---|
| Views Total: | 5,712 |
| Sitio oficial: | Ir a la web |
| Actualizado: | June 18, 2018 |
| Licencia: | MIT |
Vista prévia
Descripción
Sweet Alert es una bonita y altamente personalizable biblioteca de diálogo modal JS para reemplazar la alerta nativa de JavaScript, confirmar y diálogos rápidos.
La alerta dulce es totalmente sensible por lo que funciona muy bien en cualquier dispositivo como móvil, escritorio o tableta.
Instalación
# NPM $ npm install sweetalert --save
Funcionamiento
Incluya el sweetalert. min. js en el documento.
<script src="sweetalert.min.js"></script>
O desde un < a href = "https://cdnjs.com/libraries/sweetalert" target = "_ blank" rel = "noopener" > CDN .
<script defer src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.0/sweetalert.min.js"></script>
Muestra una ventana de alerta básica con un título y un mensaje personalizados.
- title: título de alerta
- mensaje : mensaje de alerta
- tipo: "ADVERTENCIA", "error", "Success" o "info"
// swal(TITLE, MESSAGE, TYPE);
swal("Hello world!") Todos los parámetros predeterminados para personalizar la ventana de alerta.
const myAlert = swal({
title: null,
text: null,
icon: null, // "warning", "error", "success", "info"
button: {
text: "OK",
value: true,
visible: true,
className: "",
closeModal: true,
},
buttons: {
cancel: {
text: "Cancel",
value: null,
visible: false,
className: "",
closeModal: true,
},
confirm: {
text: "OK",
value: true,
visible: true,
className: "",
closeModal: true
}
},
content: null,
className: null,
closeOnClickOutside: true,
closeOnEsc: true,
dangerMode: false,
timer: null // in ms
}) API methods.
// Closes the SweetAlert modal
myAlert.close()
// Gets the state of the current SweetAlert modal.
myAlert.getState();
// Changse the promised value of one of the modal's buttons.
// You can either pass in just a string (by default it changes the value of the confirm button), or an object.
myAlert.setActionValue({ confirm: 'Text from input' })
// Removes all loading states on the modal's buttons.
// Use it in combination with the button option closeModal: false.
myAlert.stopLoading() Registro de cambios
06/18/2018
- v2.1.0
- Doc ha actualizado
- Agregada CDN
