Commit 47e5839630a0d8656e22edfc745edaa78d28a0b3
1 parent
7c15ac9e
message components bug fixed
message components bug fixed
Showing
5 changed files
with
25 additions
and
8 deletions
Show diff stats
components/base/notification/index.js
| ... | ... | @@ -24,6 +24,9 @@ Notification.newInstance = properties => { |
| 24 | 24 | notice (noticeProps) { |
| 25 | 25 | notification.add(noticeProps); |
| 26 | 26 | }, |
| 27 | + remove (key) { | |
| 28 | + notification.close(key); | |
| 29 | + }, | |
| 27 | 30 | component: notification, |
| 28 | 31 | destroy () { |
| 29 | 32 | document.body.removeChild(div); | ... | ... |
components/base/notification/notification.vue
components/message/index.js
| ... | ... | @@ -2,11 +2,13 @@ import Notification from '../base/notification'; |
| 2 | 2 | |
| 3 | 3 | const prefixCls = 'ivu-message'; |
| 4 | 4 | const iconPrefixCls = 'ivu-icon'; |
| 5 | +const prefixKey = 'ivu_message_key_'; | |
| 5 | 6 | |
| 6 | 7 | let defaultDuration = 1.5; |
| 7 | 8 | |
| 8 | 9 | let top; |
| 9 | 10 | let messageInstance; |
| 11 | +let key = 1; | |
| 10 | 12 | |
| 11 | 13 | const iconTypes = { |
| 12 | 14 | 'info': 'information-circled', |
| ... | ... | @@ -42,6 +44,7 @@ function notice (content, duration = defaultDuration, type, onClose) { |
| 42 | 44 | let instance = getMessageInstance(); |
| 43 | 45 | |
| 44 | 46 | instance.notice({ |
| 47 | + key: `${prefixKey}${key}`, | |
| 45 | 48 | duration: duration, |
| 46 | 49 | style: {}, |
| 47 | 50 | content: ` |
| ... | ... | @@ -52,6 +55,15 @@ function notice (content, duration = defaultDuration, type, onClose) { |
| 52 | 55 | `, |
| 53 | 56 | onClose: onClose |
| 54 | 57 | }); |
| 58 | + | |
| 59 | + // 用于手动消除 | |
| 60 | + return (function () { | |
| 61 | + let target = key++; | |
| 62 | + | |
| 63 | + return function () { | |
| 64 | + instance.remove(`${prefixKey}${target}`); | |
| 65 | + } | |
| 66 | + })(); | |
| 55 | 67 | } |
| 56 | 68 | |
| 57 | 69 | export default { | ... | ... |
local/routers/msg.vue
| ... | ... | @@ -3,7 +3,7 @@ |
| 3 | 3 | <Button @click="success">success</Button> |
| 4 | 4 | <Button @click="error">error</Button> |
| 5 | 5 | <Button @click="warning">warning</Button> |
| 6 | - <Button @click="loading">loading</Button> | |
| 6 | + <Button @click="loading">手动消失</Button> | |
| 7 | 7 | </template> |
| 8 | 8 | <script> |
| 9 | 9 | import { Message, Button } from 'iview'; |
| ... | ... | @@ -42,14 +42,16 @@ |
| 42 | 42 | Message.warning('来个警告'); |
| 43 | 43 | }, |
| 44 | 44 | loading () { |
| 45 | - Message.loading('我是loading'); | |
| 45 | + const hide = Message.loading('我是loading', 0); | |
| 46 | + | |
| 47 | + setTimeout(hide, 5000); | |
| 46 | 48 | } |
| 47 | 49 | }, |
| 48 | 50 | ready () { |
| 49 | - Message.config({ | |
| 50 | - top: 50, | |
| 51 | - duration: 8 | |
| 52 | - }); | |
| 51 | +// Message.config({ | |
| 52 | +// top: 50, | |
| 53 | +// duration: 8 | |
| 54 | +// }); | |
| 53 | 55 | } |
| 54 | 56 | } |
| 55 | 57 | </script> |
| 56 | 58 | \ No newline at end of file | ... | ... |