2016-07-04 10:44:55 +08:00
|
|
|
---
|
|
|
|
category: Components
|
2016-11-09 14:43:32 +08:00
|
|
|
type: Feedback
|
2016-07-04 10:44:55 +08:00
|
|
|
noinstant: true
|
2016-09-21 11:28:38 +08:00
|
|
|
title: Message
|
2016-07-04 10:44:55 +08:00
|
|
|
---
|
|
|
|
|
|
|
|
Display global messages as feedbacks to user operations.
|
|
|
|
|
|
|
|
## When To Use
|
|
|
|
|
|
|
|
- To provide feedbacks such as success, warning, error etc.
|
|
|
|
- A message is displayed at top and center and will be dismissed automatically, as a non-interrupting light-weighted prompt.
|
|
|
|
|
|
|
|
## API
|
|
|
|
|
2017-02-27 21:50:08 +08:00
|
|
|
- `message.success(content, duration, onClose)`
|
|
|
|
- `message.error(content, duration, onClose)`
|
|
|
|
- `message.info(content, duration, onClose)`
|
|
|
|
- `message.warning(content, duration, onClose)`
|
|
|
|
- `message.warn(content, duration, onClose)`
|
|
|
|
- `message.loading(content, duration, onClose)`
|
2016-07-04 10:44:55 +08:00
|
|
|
|
|
|
|
This components provides 4 static methods, with arguments as following:
|
|
|
|
|
|
|
|
| Argument | Description | Type | Default |
|
|
|
|
|------------|------------------------------------|--------------------------|--------------|
|
2017-01-20 20:10:50 +08:00
|
|
|
| content | content of the message | string\|ReactNode | - |
|
2016-07-04 10:44:55 +08:00
|
|
|
| duration | time before auto-dismiss,in seconds | number | 1.5 |
|
2017-02-27 21:50:08 +08:00
|
|
|
| onClose | Specify a function that will be called after the message closed| Function | - |
|
2016-07-04 10:44:55 +08:00
|
|
|
|
|
|
|
Methods for global configuration and destruction are also provided:
|
|
|
|
|
|
|
|
- `message.config(options)`
|
|
|
|
- `message.destroy()`
|
|
|
|
|
2017-03-19 02:07:39 +08:00
|
|
|
### message.config
|
|
|
|
|
2016-07-04 10:44:55 +08:00
|
|
|
```js
|
|
|
|
message.config({
|
|
|
|
top: 100,
|
|
|
|
duration: 2,
|
|
|
|
});
|
|
|
|
```
|
|
|
|
|
|
|
|
| Argument | Description | Type | Default |
|
|
|
|
|------------|------------------------------------|--------------------------|-------------|
|
2017-01-20 20:10:50 +08:00
|
|
|
| top | distance to top | number | 24px |
|
|
|
|
| duration | time before auto-dismiss,in seconds | number | 1.5 |
|
2017-03-19 02:07:39 +08:00
|
|
|
| getContainer | specify render container | () => HTMLElement | () => document.body |
|