Vue-Semantic-Modal
Modal component for semantic-ui without jQuery.
Usage
<modal v-model="showModal">
<p slot="header">Confirmation needed</p>
<p slot="content">Do you want to continue?</p>
<template slot="actions">
<div class="ui black deny button" @click="showModal=false">
No
</div>
<div class="ui positive right" @click="confirm">
Yes
</div>
</template>
</modal>
import modal from 'vue_semantic_modal'
export default {
components: {
modal
},
data() {
return {
showModal: true,
confirmed: true
}
},
methods () {
confirm () {
this.confirmed = true
this.showModal = false
}
}
}
//...
Include in the root component semantic-ui CSS:
@import '~dist/semantic.css';
Slot
-
header -
content -
actions
