ui-notify

simple and pure javascript toast component

综述

• 版本：1.0.0
• 浏览器支持：h5所有浏览器 ie9+

安装

通过script标签直接引入

<script src="./ui-notify"></script>
window.Notify;

commonJs引入

var Notify = require('ui-notify');

使用方法

// alert提示框
Notify.alert('这是一个提示');

// toast提示框
Notify.toast('消息');

// confirm提示框
Notify.confirm({
    title: '是否删除',
    left: '删除',
    right: '取消',
    modal: false, // 是否有遮罩层
    fn: function () {
        // 点击删除执行的回调
    }
});

methods

alert

Notify.alert(msg)

| 参数 | 类型 | 说明 | 默认值 | | :--- | :--- | :--- | :--- | | msg* | String | 消息文字 | "" |

toast

Notify.toast('消息')
Notify.toast('消息', { 
    class: 'myClassName',
    fn: function () {
        // toast 消失了
    }
})

| 参数 | 类型 | 说明 | 默认值 | | :--- | :--- | :--- | :--- | | msg | String | 消息文字 | "" | | config（可选） | Object | 配置 | - | | config.class（可选） | String | 给DOM添加class，从而实现覆盖默认样式 | - | | config.fn（可选） | Function | toast消失时的回调 | - |

confirm

Notify.confirm({    
    title: '是否删除',
    right: '删除',
    left: '取消',
    modal: false,
    class: 'myConfirm',
    fn: function (msg) {
        // 点击执行的回调
        if (msg === 'success') {
            // 点击确认
        } else if (msg === 'fail') {
            // 点击取消
        }
    }
});

| 参数 | 类型 | 说明 | 默认值 | | :--- | :--- | :--- | :--- | | title | String | 消息文字 | "" | | modal（可选） | Boolean | 是否使用遮罩 | false | | right（可选） | String | 确认按钮文字 | 确认 | | left（可选） | String | 取消按钮文字 | 取消 | | class（可选） | String | 给DOM添加class，从而实现覆盖默认样式 | - | | fn（可选） | Function | 点击确定按钮的回调 | - |