mirror of
https://github.com/ant-design/ant-design.git
synced 2025-08-06 16:06:28 +08:00
commit
95c3a3daf9
@ -15,7 +15,7 @@ const onClose = function (e) {
|
||||
|
||||
ReactDOM.render(<div>
|
||||
<Alert message="警告提示的文案"
|
||||
type="warn"
|
||||
type="warning"
|
||||
closable
|
||||
onClose={onClose} />
|
||||
<Alert message="错误提示的文案"
|
||||
|
@ -19,7 +19,7 @@ ReactDOM.render(<div>
|
||||
<Alert
|
||||
message="警告提示的文案"
|
||||
description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
|
||||
type="warn" />
|
||||
type="warning" />
|
||||
<Alert
|
||||
message="错误提示的文案"
|
||||
description="错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍错误提示的辅助性文字介绍"
|
||||
|
@ -12,7 +12,7 @@ import { Alert } from 'antd';
|
||||
ReactDOM.render(<div>
|
||||
<Alert message="成功提示的文案" type="success" showIcon />
|
||||
<Alert message="消息提示的文案" type="info" showIcon />
|
||||
<Alert message="警告提示的文案" type="warn" showIcon />
|
||||
<Alert message="警告提示的文案" type="warning" showIcon />
|
||||
<Alert message="错误提示的文案" type="error" showIcon />
|
||||
<Alert message="成功提示的文案"
|
||||
description="成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍成功提示的辅助性文字介绍"
|
||||
@ -25,7 +25,7 @@ ReactDOM.render(<div>
|
||||
<Alert
|
||||
message="警告提示的文案"
|
||||
description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
|
||||
type="warn"
|
||||
type="warning"
|
||||
showIcon />
|
||||
<Alert
|
||||
message="错误提示的文案"
|
||||
|
@ -2,7 +2,7 @@
|
||||
|
||||
- order: 1
|
||||
|
||||
共有四种样式`success`、`info`、`warn`、`error`。
|
||||
共有四种样式 `success`、`info`、`warning`、`error`。
|
||||
|
||||
---
|
||||
|
||||
@ -12,8 +12,7 @@ import { Alert } from 'antd';
|
||||
ReactDOM.render(<div>
|
||||
<Alert message="成功提示的文案" type="success" />
|
||||
<Alert message="消息提示的文案" type="info" />
|
||||
<Alert message="警告提示的文案" type="warn" />
|
||||
<Alert message="警告提示的文案" type="warning" />
|
||||
<Alert message="错误提示的文案" type="error" />
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>, mountNode);
|
||||
````
|
||||
|
@ -54,7 +54,7 @@ export default React.createClass({
|
||||
case 'error':
|
||||
iconType = 'cross-circle';
|
||||
break;
|
||||
case 'warn':
|
||||
case 'warning':
|
||||
iconType = 'exclamation-circle';
|
||||
break;
|
||||
default:
|
||||
|
@ -17,7 +17,7 @@
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|----------- |--------------------------------------------------------- | ---------- |-------|
|
||||
| type | 必选参数,指定警告提示的样式,有四种选择`success`、`info`、`warn`、`error` | String | `info` |
|
||||
| type | 必选参数,指定警告提示的样式,有四种选择 `success`、`info`、`warning`、`error` | String | `info` |
|
||||
| closable | 可选参数,默认不显示关闭按钮 | Boolean | 无 |
|
||||
| closeText | 可选参数,自定义关闭按钮 | React.Node | 无 |
|
||||
| message | 必选参数,警告提示内容 | React.Node | 无 |
|
||||
|
@ -14,18 +14,18 @@ function getListData(value) {
|
||||
switch (value.getDayOfMonth()) {
|
||||
case 8:
|
||||
listData = [
|
||||
{ type: 'warn', content: '这里是警告事项.' },
|
||||
{ type: 'warning', content: '这里是警告事项.' },
|
||||
{ type: 'normal', content: '这里是普通事项.' }
|
||||
]; break;
|
||||
case 10:
|
||||
listData = [
|
||||
{ type: 'warn', content: '这里是警告事项.' },
|
||||
{ type: 'warning', content: '这里是警告事项.' },
|
||||
{ type: 'normal', content: '这里是普通事项.' },
|
||||
{ type: 'error', content: '这里是错误事项.' }
|
||||
]; break;
|
||||
case 15:
|
||||
listData = [
|
||||
{ type: 'warn', content: '这里是警告事项.' },
|
||||
{ type: 'warning', content: '这里是警告事项.' },
|
||||
{ type: 'normal', content: '这里是普通事项好长啊。。....' },
|
||||
{ type: 'error', content: '这里是错误事项.' },
|
||||
{ type: 'error', content: '这里是错误事项.' },
|
||||
@ -98,7 +98,7 @@ ReactDOM.render(
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.event-warn {
|
||||
.event-warning {
|
||||
color: #fac450;
|
||||
}
|
||||
|
||||
@ -107,7 +107,7 @@ ReactDOM.render(
|
||||
}
|
||||
|
||||
.event-error {
|
||||
color: #f60;
|
||||
color: #f50;
|
||||
}
|
||||
|
||||
.notes-month {
|
||||
|
@ -17,14 +17,14 @@ const error = function () {
|
||||
message.error('这是一条报错提示');
|
||||
};
|
||||
|
||||
const warn = function () {
|
||||
message.warn('这是一条警告提示');
|
||||
const warning = function () {
|
||||
message.warning('这是一条警告提示');
|
||||
};
|
||||
|
||||
ReactDOM.render(<div>
|
||||
<Button onClick={success}>显示成功提示</Button>
|
||||
<Button onClick={error}>显示报错提示</Button>
|
||||
<Button onClick={warn}>显示警告提示</Button>
|
||||
<Button onClick={warning}>显示警告提示</Button>
|
||||
</div>, mountNode);
|
||||
````
|
||||
|
||||
|
@ -1,6 +1,7 @@
|
||||
import React from 'react';
|
||||
import Notification from 'rc-notification';
|
||||
import Icon from '../icon';
|
||||
import warning from 'warning';
|
||||
|
||||
let defaultDuration = 1.5;
|
||||
let defaultTop;
|
||||
@ -21,7 +22,7 @@ function notice(content, duration = defaultDuration, type, onClose) {
|
||||
info: 'ant-message-info',
|
||||
success: 'ant-message-success',
|
||||
error: 'ant-message-error',
|
||||
warn: 'ant-message-warn',
|
||||
warning: 'ant-message-warning',
|
||||
loading: 'ant-message-loading'
|
||||
})[type];
|
||||
|
||||
@ -29,7 +30,7 @@ function notice(content, duration = defaultDuration, type, onClose) {
|
||||
info: 'info-circle',
|
||||
success: 'check-circle',
|
||||
error: 'cross-circle',
|
||||
warn: 'exclamation-circle',
|
||||
warning: 'exclamation-circle',
|
||||
loading: 'loading'
|
||||
})[type];
|
||||
|
||||
@ -62,8 +63,13 @@ export default {
|
||||
error(content, duration, onClose) {
|
||||
return notice(content, duration, 'error', onClose);
|
||||
},
|
||||
// Departed usage, please use warning()
|
||||
warn(content, duration, onClose) {
|
||||
return notice(content, duration, 'warn', onClose);
|
||||
warning(false, 'message.warn() is departed, please use message.warning()');
|
||||
return notice(content, duration, 'warning', onClose);
|
||||
},
|
||||
warning(content, duration, onClose) {
|
||||
return notice(content, duration, 'warning', onClose);
|
||||
},
|
||||
loading(content, duration, onClose) {
|
||||
return notice(content, duration, 'loading', onClose);
|
||||
|
@ -22,7 +22,7 @@ ReactDOM.render(
|
||||
<div>
|
||||
<Button onClick={openNotificationWithIcon('success')}>成功</Button>
|
||||
<Button onClick={openNotificationWithIcon('info')}>消息</Button>
|
||||
<Button onClick={openNotificationWithIcon('warn')}>警告</Button>
|
||||
<Button onClick={openNotificationWithIcon('warning')}>警告</Button>
|
||||
<Button onClick={openNotificationWithIcon('error')}>错误</Button>
|
||||
</div>
|
||||
, mountNode);
|
||||
|
@ -1,6 +1,7 @@
|
||||
import React from 'react';
|
||||
import Notification from 'rc-notification';
|
||||
import Icon from '../icon';
|
||||
import warning from 'warning';
|
||||
|
||||
let defaultTop = 24;
|
||||
let notificationInstance;
|
||||
@ -40,7 +41,7 @@ function notice(args) {
|
||||
case 'error':
|
||||
iconType = 'cross-circle-o';
|
||||
break;
|
||||
case 'warn':
|
||||
case 'warning':
|
||||
iconType = 'exclamation-circle-o';
|
||||
break;
|
||||
default:
|
||||
@ -50,9 +51,7 @@ function notice(args) {
|
||||
getNotificationInstance().notice({
|
||||
content: <div>
|
||||
<Icon className={`${prefixCls}icon-${args.icon}${prefixCls}icon`} type={iconType} />
|
||||
|
||||
<div className={`${prefixCls}message`}>{args.message}</div>
|
||||
|
||||
<div className={`${prefixCls}description`}>{args.description}</div>
|
||||
</div>,
|
||||
duration,
|
||||
@ -80,7 +79,6 @@ function notice(args) {
|
||||
getNotificationInstance().notice({
|
||||
content: <div>
|
||||
<div className={`${prefixCls}message`}>{args.message}</div>
|
||||
|
||||
<div className={`${prefixCls}description`}>{args.description}</div>
|
||||
<span className={`${prefixCls}btn`}>
|
||||
{args.btn}
|
||||
@ -121,14 +119,14 @@ const api = {
|
||||
},
|
||||
};
|
||||
|
||||
['success', 'info', 'warn', 'error'].forEach((type) => {
|
||||
api[type] = (args) => {
|
||||
let newArgs = {
|
||||
...args,
|
||||
icon: type
|
||||
};
|
||||
return api.open(newArgs);
|
||||
};
|
||||
['success', 'info', 'warning', 'error'].forEach((type) => {
|
||||
api[type] = (args) => api.open({ ...args, icon: type });
|
||||
});
|
||||
|
||||
// warn: Departed usage, please use warning()
|
||||
api.warn = (...args) => {
|
||||
warning(false, 'notification.warn() is departed, please use notification.warning()');
|
||||
api.warning(...args);
|
||||
};
|
||||
|
||||
export default api;
|
||||
|
@ -22,7 +22,7 @@
|
||||
- `notification.success(config)`
|
||||
- `notification.error(config)`
|
||||
- `notification.info(config)`
|
||||
- `notification.warn(config)`
|
||||
- `notification.warning(config)`
|
||||
- `notification.close(key: String)`
|
||||
- `notification.destroy()`
|
||||
|
||||
|
@ -42,7 +42,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&-warn {
|
||||
&-warning {
|
||||
border: 1px solid tint(@warning-color, 80%);
|
||||
background-color: tint(@warning-color, 90%);
|
||||
.@{alert-prefix-cls}-icon {
|
||||
|
@ -34,7 +34,7 @@
|
||||
color: @error-color;
|
||||
}
|
||||
|
||||
&-warn.anticon {
|
||||
&-warning.anticon {
|
||||
color: @warning-color;
|
||||
}
|
||||
|
||||
|
@ -61,7 +61,7 @@
|
||||
&-info {
|
||||
color: @primary-color;
|
||||
}
|
||||
&-warn {
|
||||
&-warning {
|
||||
color: @warning-color;
|
||||
}
|
||||
&-error {
|
||||
|
Loading…
Reference in New Issue
Block a user