ember flash notifications

Ember-Flash-untifications

Addon은 Ember.js 응용 프로그램에 플래시 알림을 표시하도록 설계되었습니다. Popover API로 구동.

호환성

• ember.js v4.8 이상
• Ember CLI v4.8 이상
• node.js v18 이상

설치

 ember install ember-flash-notifications

용법

템플릿에 FlashNotifications 호출 추가 :

 <FlashNotifications as |notification|>
  <FlashNotification @notification={{notification}}>
    <div class={{notification.type}}>{{notification.message}}</div>
  </FlashNotification>
</FlashNotifications>

알림 요소에 최소한의 필수 스타일을 추가하십시오 (Tailwindcss는 종속성이 아니며 일반 CSS를 사용할 수 있습니다) :

[popover] {
  @apply my-0 mr-0;
}

.flash {
  @apply w-80 border transition-opacity block opacity-0;
}

.flash:popover-open {
  @apply opacity-100;
}

.flash .error {
  @apply bg-rose-500 text-white p-2 rounded-sm;
}

@starting-style {
  .flash:popover-open {
    @apply opacity-0;
  }
}

... 그리고 알림 호출 :

 mport { action } from '@ember/object';
import Component from '@glimmer/component';
import { inject as service } from '@ember/service';

export default class FlashComponent extends Component {
  @service notifications;

  @action
  addNotification() {
    this.notifications.error('Something is going wrong!');
  }
}

자세한 예제, API Documetation 및 라이브 예제를 참조하십시오

기여

자세한 내용은 기고 안내서를 참조하십시오.

특허

이 프로젝트는 MIT 라이센스에 따라 라이센스가 부여됩니다.