logo Buffalo slack logo
Mensajes Flash
Frontend

Mensajes Flash#

Qué son los mensaje Flash?#

Los mensajes flash son una forma de comunicar mensajes al usuario final desde el interior de la aplicacón. Estos mensajes pueden ser de tipo error, advertencia o éxito.

Algunos ejemplos de mensajes flash son:

  • “Se ha cerrado la sesión con éxito.”
  • “Su widget no pudo ser actualizado”.
  • “Hubo un problema de acceso a su cuenta”.

Poder establecer estos mensajes en un handler de Buffalo y luego pasarlos a las vistas es increíblemente útil.

Estableciendo mensajes Flahs#

La creación de mensajes flash puede hacerse fácilmente utilizando la función c.Flash() proporcionada en el buffalo.Context.

func WidgetsCreate(c buffalo.Context) error {
  // do some work
  c.Flash().Add("success", "Widget was successfully created!")
  // do more work and return
}

El nombre de la “llave”, en este ejemplo, “success”, se dejan a discreción de tu aplicación para que las uses como mejor te convenga. No hay llaves “especiales” o “predefinidas”.

Accediendo a los mensajes Flash en plantillas#

Este documento solo aplica cuando se usa github.com/gobuffalo/buffalo/render.

Consulta github.com/gobuffalo/plush para más detalles sobre el paquete de plantillas.

Recorriendo sobre todos los mensajes Flash#

<div class="row">
  <div class="col-md-12">
    <%= for (k, messages) in flash { %>
      <%= for (msg) in messages { %>
        <div class="alert alert-<%= k %>" role="alert">
          <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button>
          <%= msg %>
        </div>
      <% } %>
    <% } %>
  </div>
</div>

Recorriendo sobre una llave de mensaje Flash#

<div class="row">
  <div class="col-md-12">
    <%= for (message) in flash["success"] { %>
      <div class="alert alert-success" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <%= message %>
      </div>
    <% } %>
  </div>
</div>