# Message (notificación breve)

Barra de retroalimentación global ligera, montada en la parte superior de la página. LhMessage.success('Guardado') lista para usar; el tipo loading debe cerrarse manualmente.

Notificación breve
<template>
  <div class="demo-col">
    <div class="demo-row" style="gap: 12px; flex-wrap: wrap">
      <LhButton @click="show('info')">Información</LhButton>
      <LhButton type="primary" @click="show('success')">Éxito</LhButton>
      <LhButton type="warning" @click="show('warning')">Advertencia</LhButton>
      <LhButton type="danger" @click="show('danger')">Peligro</LhButton>
      <LhButton @click="showLoading">Cargando</LhButton>
      <LhButton @click="showClose">Con botón de cierre</LhButton>
      <LhButton @click="closeAll">Cerrar todas</LhButton>
    </div>
    <p class="demo-note">LhMessage.success('Guardado') es la forma más habitual; el tipo loading requiere cierre manual.</p>
  </div>
</template>

<script>
export default {
  methods: {
    show(type) {
      LhMessage[type]('Esta es una notificación de tipo ' + type)
    },
    showLoading() {
      LhMessage.loading('Guardando…')
    },
    showClose() {
      LhMessage({ content: 'Notificación cerrable manualmente', showClose: true })
    },
    closeAll() {
      LhMessage.closeAll()
    },
  },
}
</script>

# API de servicio

LhMessage('Notificación normal')            // info por defecto
LhMessage.success('Guardado')               // info / success / warning / danger / loading
LhMessage({ content: 'Cerrable', showClose: true, closeLabel: 'Entendido' })
LhMessage.closeAll()                        // Cierra todas

# Message Props

Propiedad Descripción Tipo Predeterminado
content Contenido de la notificación string —
type Tipo 'info' \| 'success' \| 'warning' \| 'danger' \| 'loading' 'info'
showClose Si se muestra el botón de cierre boolean false
closeLabel Nombre de accesibilidad del botón de cierre (si no se pasa, se usa message.close del paquete de idioma) string —
sx Propiedad de diseño rápido sx — —

Consejo

El tipo loading no se cierra solo: cuando termine la operación, llama a LhMessage.closeAll() o conserva el manejador tú mismo.

Copyright © 2024-2026 FengMo WenXue