Vue.js modal

Simple to use vue.js modal plgin without any external dependencies

How to use

Include plugin in your main.js file.

import 'vue-modal';

Create modal

<modal name="hello-world">
  hello, world!
</modal>

Call it from anywhere in the app

methods: {
  show() { 
    this.$modal.show('hello-word');
  },
  hide () {
    this.$modal.hide('hello-world');
  }
}

Properties

Name	Required	Type	Default	Description
name	true	[String, Number]		Name of the modal
delay	false	Number	0	Delay between showing overlay and actual modal box
resizable	false	Boolean	false	If true, allows to resize modal window, keeping it in the center of the screen.
adaptive	false	Boolean	false	If true, modal box will try to adapt to the window size
transition	false	String		Transition name
classes	false	[String, Array]	'nice-modal'	Classes that will eb applied to the actual modal box, if specified not specified, the default 'nice-modal' class will eb applied
width	false	Number	600
height	false	Number	300
minWidth	false	Number	0	The minimum width to which modal can be resized
minHeight	false	Number	0	The minimum height to which modal can be resized

Events

| Name | Description | | --- | | | before-open | | | open | | | before-close | | | close | |

Screenshots