vue-modal-comp v0.1.7

vue-modal-component

A simple modal component for Vue.js. Live demo here.

Installation

npm install vue-modal-comp --save

Usage

This package is not finalized yet. Don't use it in production until it reaches 1.0.0.

This package has two main components:

• Modal.vue
• ModalButton.vue

And additional ones for common use cases:

• Alert.vue
• Confirm.vue
• Prompt.vue

Please note that the CSS is not included. It's totally up to you to make it looks however you want. You can take inspiration from the demo's code, though.

Modal.vue

import { Modal, ModalButton } from 'vue-modal-comp'

export default {
    components: {
        Modal,
        ModalButton
    }
}

<button type="button" @click="$refs.modal.toggle()">
    Toggle
</button>

<modal ref="modal">
    <h1 slot="title">Hello, World!</h1>

    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nostrum illo corrupti totam necessitatibus iste, accusantium ex, molestias magnam nisi quod!</p>

    <modal-button @click="$refs.modal.close()">OK</modal-button>
</modal>

ModalButton.vue

Coming soon…

Alert.vue

Coming soon…

Confirm.vue

Coming soon…

Prompt.vue

Coming soon…

License

WTFPL