0.3.2 • Published 6 years ago
simpel-modal v0.3.2
Simpel Modal is very simple Vue.js component for modal windows. Take a look.
To use this component you need to install Vue.js first.
If you use node, you can install simpel-modal
component with npm or yarn:
npm i --save simpel-modal
yarn add simpel-modal
As an alternative you can reference the script and the styles in HTML code (the files can be found in /dist/
directory):
<link rel="stylesheet" href="/simpel-modal.css">
<script src="/simpel-modal.js"></script>
Once installed, you can register the component globally:
import SimpelModal from 'simpel-modal';
Vue.component('simpel-modal', SimpelModal)
Then it can be used in a template as:
<simpel-modal ref="greeting-modal">
Hey!
</simpel-modal>
To control the component call .open()
or .close()
method through a reference:
methods: {
openDemo() {
this.$refs['greeting-modal'].open();
},
closeDemo() {
this.$refs['greeting-modal'].close();
},
},
Name | Required | Type | Default | Description |
---|---|---|---|---|
id | false | String, Number | random | Id of the modal container |
yOffset | false | Number | 0 | Vertical offset of the modal container |
fullscreen | false | Boolean | false | Enables fullscreen mode |
Supports nested modals