消息提醒 Message
issue

全局展示操作反馈信息。

何时使用

例如:成功、失败、警告等提示

如何使用

import { Message } from 'tinper-bee';

or

import Message from 'bee-message';
import 'bee-message/build/Message.css';

能力特性

API

函数api

//设置默认设置
Message.config({
    top: 20,  //顶上显示时距顶部的位置
    bottom: 20, //左下右下显示时距底部的位置
    defaultBottom: 20, //底部显示时距底部的位置
    duration: 20, //显示持续时间
    width: 500 //左下左上右下右上显示时的宽度
    });

//销毁所有消息
Message.destroy();

//创建消息
Messsage.create({});

message函数参数

参数 说明 类型 默认值
content 内容 string/number -
duration 显示时间 number 3
color 颜色 dark / light / success / danger / warning / info / successlight / dangerlight / warninglight / infolight light
onClose 关闭时的钩子函数 function -
position 弹出框显示的位置 top / bottom / topRight / topLeft / bottomRight / bottomLeft top
style 样式 object {}
keyboard esc触发关闭 boolean true
onEscapeKeyUp 响应ESC键时的钩子函数 function -
showIcon 是否显示icon boolean true
icon 自定义显示icon图标参考这里 string -

已支持的键盘操作

按键 功能
esc 关闭message

注意事项

暂无

更新日志

  • v2.1.7 2020-04-24 ( release地址 )

    Bug Fixes

  • v2.1.6 2019-09-30 ( release地址 )

    • bee-message @2.1.6
      • [Fixbug]解决新老版本样式冲突问题,主要是关闭按钮样式问题。
  • v2.1.5 2019-09-23 ( release地址 )

    • bee-message @2.1.5
      • [Feature]支持自定义属性。
  • v2.1.3 2019-08-14 ( release地址 )

    • bee-message @2.1.3
      • [Feature]增加 icon API,支持自定义图标。
  • v2.1.2 2019-08-06 ( release地址 )

    • bee-message @2.1.2
      • [Feature]解决 showIcon 属性隐藏图标无效的问题。
  • v2.1.0 2019-06-05 ( release地址 )

    • bee-message @2.1.0
      • [Feature] 支持通过 style 参数设置通栏样式
  • v2.0.4 2019-05-15 ( release地址 )

    • bee-message @2.0.4
      • [Fixbug]解决组件第二次调用create方法报错问题
  • v2.0.3 2019-05-07 ( release地址 )

    • bee-message @2.0.3
      • [Feature]组件交互优化
      • [Feature]关闭按钮距右的间距改为16px
  • v2.0.2 2019-04-24 ( release地址 )

    • bee-message @2.0.2
      • [Fixbug]解决Message.config()方法无效的问题
  • v2.0.1 2019-04-24 ( release地址 )

    • bee-message @2.0.1
      • [Fixbug]解决Message组件被Modal组件遮盖的问题
  • v2.0.0 2019-03-15 ( release地址 )

    • [Feature]相关2.0主题依赖组件升级