0.0.7 • Published 7 years ago

hsy-vue-dialog v0.0.7

Weekly downloads
22
License
-
Repository
-
Last release
7 years ago

vue-dialog

This is yet another vue dialog component.

Install

Use npm to download code:

npm install hsy-vue-dialog -S

then import it into your project, add below code into your main.js:

import Dialog from 'hsy-vue-dialog'

Vue.use(Dialog)

Usage

<button @click="visible = true">remove</button>

<hsy-dialog class="confirm" v-model="visible">
  <div slot="title">Remove</div>
  <div slot="body">
    <div>This operation is irreversible, are you sure?</div>
    <div>
      <button @click="handleYes">Yes</button>
      <button>No</button>
    </div>
  </div>
</hsy-dialog>

<script>
export default {
  data() {
    return {
      visible: false
    }
  },
  methods: {
    handleYes() {
      alert('Yes')
      this.visible = false
    }
  }
}
</script>

Props

PropDescriptionTypeAccepted ValuesDefault
valuewhether dialog is visible or notBoolean--false
closeButtonwhether close button is visible or notBoolean--true
clickMask2Closeif dialog should be closed when mask is clickedBoolean--true

Demo

demo

Screenshot

0.0.7

7 years ago

0.0.6

7 years ago

0.0.5

7 years ago

0.0.4

7 years ago

0.0.3

7 years ago

0.0.2

7 years ago

0.0.1

7 years ago