diff --git a/components/message/demo/costomTime.md b/components/message/demo/costomTime.md new file mode 100644 index 0000000000..78aea1af84 --- /dev/null +++ b/components/message/demo/costomTime.md @@ -0,0 +1,22 @@ + +# 基本 + +- order: 4 + +全局提示 - 操作成功提示,并自定义时长10s,默认时长2.5s + +--- + +````jsx + +var message = antd.message; +var success = function(){ + message.success('这是一条成功的提示,并将于10秒后消失',10); +} + +React.render( + , document.getElementById('components-message-demo-costomtime') +); + +```` + diff --git a/components/message/demo/error.md b/components/message/demo/error.md index 26dd948dc1..3a8f1348c7 100644 --- a/components/message/demo/error.md +++ b/components/message/demo/error.md @@ -2,7 +2,7 @@ - order: 1 -全局提示 - 操作警告 +全局提示 - 操作失败 --- diff --git a/components/message/demo/info.md b/components/message/demo/info.md index 6223fba2af..429e467efd 100644 --- a/components/message/demo/info.md +++ b/components/message/demo/info.md @@ -2,7 +2,7 @@ - order: 2 -全局提示 - 需求帮助 +全局提示 - 提醒 --- @@ -10,11 +10,11 @@ var message = antd.message; var info = function(){ - message.info('这是一条普通的提示'); + message.info('这是一条普通的提醒'); } React.render( - , document.getElementById('components-message-demo-info') + , document.getElementById('components-message-demo-info') ); ```` \ No newline at end of file diff --git a/components/message/index.jsx b/components/message/index.jsx index 5695b31f99..39182d8ff7 100644 --- a/components/message/index.jsx +++ b/components/message/index.jsx @@ -19,50 +19,59 @@ var getMessageInstance = function(){ module.exports = { - info: function(m) { + info: function(m, t) { if (!message) { message = getMessageInstance(); } - + t = t || 2.5; message.notice({ key: 'simpleMessage', - duration: 2.5, + duration: t, style: { left: '50%' }, - content:
{m}
+ content:
+ + {m} +
}); }, - success: function(m) { + success: function(m, t) { if (!message) { message = getMessageInstance(); } - + t = t || 2.5; message.notice({ key: 'simpleMessage1', transitionName: 'move-up', - duration: 2.5, + duration: t, style: { left: '50%' }, - content:
{m}
+ content:
+ + {m} +
}); }, - error: function(m) { + error: function(m, t) { if (!message) { message = getMessageInstance(); } - + t = t || 2.5; message.notice({ key: 'simpleMessage2', transitionName: 'move-up', - duration: 2.5, + duration: t, style: { left: '50%' }, - content:
{m}
+ content:
+ + {m} +
}); } }; diff --git a/components/message/index.md b/components/message/index.md index 144722a09b..139834420c 100644 --- a/components/message/index.md +++ b/components/message/index.md @@ -2,7 +2,7 @@ - category: Components - chinese: 全局提示 -- order: 3 +- order: 4 --- diff --git a/style/components/message.less b/style/components/message.less index 5006920dbd..3419b56dba 100644 --- a/style/components/message.less +++ b/style/components/message.less @@ -49,48 +49,4 @@ margin-right: 8px; } - .fade-effect() { - animation-duration: 0.3s; - animation-fill-mode: both; - animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2); - } - - &-fade-enter { - opacity: 0; - .fade-effect(); - animation-play-state: paused; - } - - &-fade-leave { - .fade-effect(); - animation-play-state: paused; - } - - &-fade-enter&-fade-enter-active { - animation-name: rcNotificationFadeIn; - animation-play-state: running; - } - - &-fade-leave&-fade-leave-active { - animation-name: rcDialogFadeOut; - animation-play-state: running; - } - - @keyframes rcNotificationFadeIn { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } - } - - @keyframes rcDialogFadeOut { - 0% { - opacity: 1; - } - 100% { - opacity: 0; - } - } }