vuetify v-alert 기본 사용법

vuejs 의 UI Framework 중인 하나인 vuetify 에서는 Alert 도 기본적으로 제공을 합니다.
v-alert 에는 기본적으로 success, info, warning, error 을 제공합니다. 
그리고 기본적인 아이콘도 제공을 합니다.

반응형

<template>
  <div>
    <v-alert type="success">
      I'm a success alert.
    </v-alert>

    <v-alert type="info">
      I'm an info alert.
    </v-alert>

    <v-alert type="warning">
      I'm a warning alert.
    </v-alert>

    <v-alert type="error">
      I'm an error alert.
    </v-alert>
  </div>
</template>

  위의 모양처럼 예쁘게 Alert 창이 뜹니다. ^^
  vuetify 는  UI Components 를 살펴보면 정말 사용할만한것이 많네요. 
 개발자에게 많은 도움을 주는 framework 인 것 같습니다.

https://vuetifyjs.com/en/components/alerts/

Alert component