To display a notification message at the four corner of the viewport. Typically it can be
To display a notification message at any of the four corners of the viewport. Typically it can be
used in the following cases:
used in the following cases:
- A notification with complex content.
- A notification with complex content.
@ -35,14 +35,13 @@ The properties of config are as follows:
| className | Customized CSS class | string | - |
| className | Customized CSS class | string | - |
| style | Customized inline style | Object | - |
| style | Customized inline style | Object | - |
| btn | Customized close button | ReactNode | - |
| btn | Customized close button | ReactNode | - |
| icon | Customized icon | ReactNode | _ |
| icon | Customized icon | ReactNode | - |
| key | The unique identifier of current notification | string | - |
| key | The unique identifier of the Notification | string | - |
| onClose | Specify a function that will be called after clicking the default close button | Function | - |
| onClose | Specify a function that will be called when the close button is clicked | Function | - |
| duration | A notification box is closed after 4.5s by default. When specifying `duration` to null or 0, it will never be closed automatically | number | 4.5 |
| duration | Time in seconds before Notification is closed. When set to 0 or null, it will never be closed automatically | number | 4.5 |
| placement | To set the position, which can be one of `topLeft``topRight``bottomLeft``bottomRight` | string | topRight |
| placement | Position of Notification, can be one of `topLeft``topRight``bottomLeft``bottomRight` | string | `topRight` |
`notification` also provide a global `config()` method that can be used for specifying the default options. Once this method is used, all the notification boxes
`notification` also provides a global `config()` method that can be used for specifying the default options. Once this method is used, all the notification boxes will take into account these globally defined options when displaying.
will take into account these globally defined options before displaying.