Message 전역 메시지

페이지 상단에 표시되는 전역 가벼운 피드백 바입니다. LhMessage.success('저장됨')으로 바로 사용할 수 있으며, loading 유형은 수동으로 닫아야 합니다.

전역 메시지

<template>
  <div class="demo-col">
    <div class="demo-row" style="gap: 12px; flex-wrap: wrap">
      <LhButton @click="show('info')">정보</LhButton>
      <LhButton type="primary" @click="show('success')">성공</LhButton>
      <LhButton type="warning" @click="show('warning')">경고</LhButton>
      <LhButton type="danger" @click="show('danger')">위험</LhButton>
      <LhButton @click="showLoading">로딩 중</LhButton>
      <LhButton @click="showClose">닫기 버튼 포함</LhButton>
      <LhButton @click="closeAll">모두 닫기</LhButton>
    </div>
    <p class="demo-note">LhMessage.success('저장됨')이 가장 자주 쓰이는 형태입니다. loading 유형은 수동으로 닫아야 합니다.</p>
  </div>
</template>

<script>
export default {
  methods: {
    show(type) {
      LhMessage[type]('이것은 ' + type + ' 알림입니다')
    },
    showLoading() {
      LhMessage.loading('저장 중…')
    },
    showClose() {
      LhMessage({ content: '수동으로 닫을 수 있는 알림', showClose: true })
    },
    closeAll() {
      LhMessage.closeAll()
    },
  },
}
</script>

서비스 API

LhMessage('일반 알림')                    // 기본 info
LhMessage.success('저장됨')              // info / success / warning / danger / loading
LhMessage({ content: '닫기 가능', showClose: true, closeLabel: '확인했습니다' })
LhMessage.closeAll()                     // 모두 닫기

Message Props

프로퍼티	설명	타입	기본값
content	알림 내용	string	—
type	유형	'info' \| 'success' \| 'warning' \| 'danger' \| 'loading'	'info'
showClose	닫기 버튼 표시 여부	boolean	false
closeLabel	닫기 버튼의 접근성 이름 (미전달 시 언어 팩 message.close 사용)	string	—
sx	sx 레이아웃 단축 속성	—	—

팁

loading 유형은 자동으로 닫히지 않습니다. 비즈니스 로직이 끝난 후 LhMessage.closeAll()을 호출하거나 직접 핸들을 보관하세요.