vue-friendly-alert

vue的alert、loading弹窗

Usage no npm install needed!

<script type="module">
  import vueFriendlyAlert from 'https://cdn.skypack.dev/vue-friendly-alert';
</script>

README

vue-friendly-alert

基于vue,一个简单友好的alert弹窗和loading弹窗

安装

npm install --save vue-friendly-alert

使用方法

import alert from 'vue-friendly-alert'
Vue.use(alert)
例如home.vue
<template>
  <div @click.stop="click">
  </div>
</template>
<script>
export default {
    data() {
        return {
            
        }
    },
    methods: {
        click() {
            this.$alert({
                // 弹出类型 默认: alert , 可选 alert|loading
                // 弹出内容
                msg: 'hello',
                // 延时
                duration: 3000,
                // 弹窗消息执行的方法
                close() {
                    console.log('弹窗关闭执行的方法')
                }
            })

            // loading类型使用 - 不会自动关闭
            this.$alert({
                msg: 'hello',
                type: 'loading'
            })
            // 需要关闭的时候执行
            this.$closeAlertLoading()
        }
    }
}
</script>