<template lang="pug"> transition(name='alert', enter-active-class="animated zoomIn", leave-active-class="animated fadeOutRight") .alert(v-if='shown', v-bind:class='style') .alert-icon: i(v-bind:class='icon') .alert-msg {{ msg }} </template> <script> export default { name: 'alert', data () { return {} }, computed: { shown() { return this.$store.state.alert.shown }, style() { return 'is-' + this.$store.state.alert.style }, icon() { return 'nc-icon-outline ' + this.$store.state.alert.icon }, msg() { return this.$store.state.alert.msg }, } } </script>