Notification box
Examples
Basic
Basic.
Placement
Control placement of Notication.
Async method
Async method.
Update
Update.
Hide close icon
Set hideClose to hide close icon。
Maximum number of Notications
Controls the number of Notications.
方法调用
直接通过方法调用。
Methods
The component provides some static methods, the usage and parameters are as follows:
Notication.success(config | string)Notication.error(config | string)Notication.info(config | string)Notication.warning(config | string)Notication.loading(config | string)Notication.open(config | string)
The config type is as follows
| Property | Description | Type | Default | Require |
|---|---|---|---|---|
| content | prompt content | ReactNode | - | true |
| description | detail description | ReactNode | - | - |
| footer | custom footer, such as buttons | ReactNode | - | - |
| duration | Delay for automatic shutdown, in millisecond. Do not close automatically when set to 0 | number | 4500 | - |
| icon | custom icon | ReactNode | - | - |
| closeIcon | Custom close icon | ReactNode | - | - |
| hideClose | Whether to hide the close icon | boolean | - | - |
| onAfterClosed | callback after Message is closed | () => void | - | - |
In addition to the above parameters, it also supports basic
HTMLAttributes, such asclassName,style.
setGlobalConfig
For the global method,
ThemeContextandConfigContextcannot be obtained through the context, so we also provide a method of manually setting
Notication.setGlobalConfig({
themeProviderProps: Omit<ThemeProviderProps, 'children'>,
configProviderProps: Omit<ConfigProviderProps, 'children'>,
container?: PortalContainerType<HTMLElement>;
distance?: number;
placement?: NoticationPlacement;
});
For details, please refer to ThemeProvider, ConfigProvider