From 706caa855f6d5f242683db8ae5ca3bd5fd09cdee Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Wed, 29 Jul 2015 18:44:56 +0800
Subject: [PATCH] update alert component

---
 components/alert/demo/basic.md       | 10 ++-----
 components/alert/demo/closable.md    | 25 ++++++++++-------
 components/alert/demo/close-type.md  | 10 ++-----
 components/alert/demo/description.md | 40 +++++++++++-----------------
 components/alert/demo/onClose.md     | 33 -----------------------
 components/alert/demo/style.md       | 25 +++++------------
 components/alert/index.jsx           | 21 +++++++++------
 components/alert/index.md            |  1 +
 8 files changed, 56 insertions(+), 109 deletions(-)
 delete mode 100644 components/alert/demo/onClose.md

diff --git a/components/alert/demo/basic.md b/components/alert/demo/basic.md
index 0e23ae1319..552cb6cc9c 100644
--- a/components/alert/demo/basic.md
+++ b/components/alert/demo/basic.md
@@ -9,12 +9,6 @@
 ````jsx
 var Alert = require('antd/lib/alert');
 
-React.render(
-  <div>
-    <Alert
-      message="警告提示的文案"
-      type="success"
-    />
-  </div>,
-document.getElementById('components-alert-demo-basic'));
+React.render(<Alert message="警告提示的文案" type="success" />
+, document.getElementById('components-alert-demo-basic'));
 ````
diff --git a/components/alert/demo/closable.md b/components/alert/demo/closable.md
index 58fc3cf66b..ec023b3ccc 100644
--- a/components/alert/demo/closable.md
+++ b/components/alert/demo/closable.md
@@ -9,13 +9,20 @@
 ````jsx
 var Alert = require('antd/lib/alert');
 
-React.render(
-  <div>
-    <Alert
-      message="警告提示的文案"
-      type="success"
-      closable="true"
-    />
-  </div>,
-document.getElementById('components-alert-demo-closable'));
+var onClose = function(e) {
+  console.log(e, '我要被关闭啦！');
+};
+
+React.render(<div>
+  <Alert message="警告提示的文案"
+    type="warn"
+    closable
+    onClose={onClose} />
+  <Alert message="警告提示的标题"
+    description="警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案"
+    type="error"
+    closable
+    onClose={onClose} />
+</div>, document.getElementById('components-alert-demo-closable'));
 ````
+
diff --git a/components/alert/demo/close-type.md b/components/alert/demo/close-type.md
index 153441dd99..1c80a181be 100644
--- a/components/alert/demo/close-type.md
+++ b/components/alert/demo/close-type.md
@@ -11,12 +11,6 @@ var Alert = require('antd/lib/alert');
 var link = <a href="javascript:;">不再提醒</a>
 
 React.render(
-  <div>
-    <Alert
-      message="警告提示的文案"
-      type="info"
-      closeText={link}
-    />
-  </div>,
-document.getElementById('components-alert-demo-close-type'));
+<Alert message="警告提示的文案" type="info" closeText={link} />
+, document.getElementById('components-alert-demo-close-type'));
 ````
diff --git a/components/alert/demo/description.md b/components/alert/demo/description.md
index 2daa2e99d9..1adc39f013 100644
--- a/components/alert/demo/description.md
+++ b/components/alert/demo/description.md
@@ -9,28 +9,20 @@
 ````jsx
 var Alert = require('antd/lib/alert');
 
-React.render(
-  <div>
-    <Alert 
-      message="警告提示的文案"
-      description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
-      type="success"
-    />
-    <Alert 
-      message="警告提示的文案"
-      description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
-      type="info"
-    />
-    <Alert 
-      message="警告提示的文案"
-      description="警告提示的辅助性文字介绍"
-      type="warn"
-    />
-    <Alert 
-      message="警告提示的文案"
-      description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
-      type="error"
-    />
-  </div>,
-document.getElementById('components-alert-demo-description'));
+React.render(<div>
+  <Alert message="警告提示的文案"
+    description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
+    type="success" />
+  <Alert message="警告提示的文案"
+    description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
+    type="info" />
+  <Alert
+    message="警告提示的文案"
+    description="警告提示的辅助性文字介绍"
+    type="warn" />
+  <Alert
+    message="警告提示的文案"
+    description="警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍警告提示的辅助性文字介绍"
+    type="error" />
+</div>, document.getElementById('components-alert-demo-description'));
 ````
diff --git a/components/alert/demo/onClose.md b/components/alert/demo/onClose.md
deleted file mode 100644
index 0da735ebce..0000000000
--- a/components/alert/demo/onClose.md
+++ /dev/null
@@ -1,33 +0,0 @@
-# 回调函数
-
-- order: 5
-
-警告提示被关闭时触发的回调函数，必须设置`closable="true"`。
-
----
-
-````jsx
-var Alert = require('antd/lib/alert');
-
-var onClose = function(){
-  console.log('我要被关闭啦！');
-}
-
-React.render(
-  <div>
-    <Alert
-      message="警告提示的文案"
-      type="warn"
-      closable="true"
-      onClose={onClose}
-    />
-    <Alert
-      message="警告提示的标题"
-      description="警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案警告提示的文案"
-      type="error"
-      closable="true"
-      onClose={onClose}
-    />
-  </div>,
-document.getElementById('components-alert-demo-onclose'));
-````
diff --git a/components/alert/demo/style.md b/components/alert/demo/style.md
index 336ccbc4d2..519501bc66 100644
--- a/components/alert/demo/style.md
+++ b/components/alert/demo/style.md
@@ -9,24 +9,11 @@
 ````jsx
 var Alert = require('antd/lib/alert');
 
-React.render(
-  <div>
-    <Alert
-      message="警告提示的文案"
-      type="success"
-    />
-    <Alert
-      message="警告提示的文案警告提示的文案"
-      type="info"
-    />
-    <Alert
-      message="警告提示的文案"
-      type="warn"
-    />
-    <Alert
-      message="警告提示的文案警告提示的文案"
-      type="error"
-    />
-  </div>,
+React.render(<div>
+  <Alert message="警告提示的文案" type="success" />
+  <Alert message="警告提示的文案警告提示的文案" type="info" />
+  <Alert message="警告提示的文案" type="warn" />
+  <Alert message="警告提示的文案警告提示的文案" type="error" />
+</div>,
 document.getElementById('components-alert-demo-style'));
 ````
diff --git a/components/alert/index.jsx b/components/alert/index.jsx
index 8fa18ea209..663789bff1 100644
--- a/components/alert/index.jsx
+++ b/components/alert/index.jsx
@@ -2,21 +2,26 @@ import React from 'react';
 
 export default React.createClass({
   getDefaultProps() {
-    return {prefixCls: 'ant-alert'};
+    return {
+      prefixCls: 'ant-alert'
+    };
   },
-  getInitialState () {
-    return {display: 'block'};
+  getInitialState() {
+    return {
+      display: 'block'
+    };
   },
-  handleClose () {
+  handleClose(e) {
     if (this.props.onClose) {
-      this.props.onClose();
+      this.props.onClose.call(this, e);
     }
     this.setState({
       display: 'none'
     });
   },
   render () {
-    var iconClass = this.props.description ? 'ant-alert-with-description-icon anticon-' : 'ant-alert-icon anticon-';
+    var iconClass = this.props.description ?
+      'ant-alert-with-description-icon anticon-' : 'ant-alert-icon anticon-';
     switch (this.props.type) {
       case 'success':
         iconClass += 'check-circle';
@@ -32,7 +37,7 @@ export default React.createClass({
         iconClass += 'default';
     }
     if (this.props.description) {
-      let close = this.props.closable === 'true' ?
+      let close = this.props.closable ?
         <a onClick={this.handleClose} className={'ant-alert-with-description-close-icon'}><span
           className='ant-alert-with-description-close-icon-x'></span></a> : '';
       return (
@@ -54,7 +59,7 @@ export default React.createClass({
           </div>
         );
       } else {
-        let close = this.props.closable === 'true' ?
+        let close = this.props.closable ?
           <a onClick={this.handleClose} className={'ant-alert-close-icon'}>
             <span className='ant-alert-close-icon-x'></span>
           </a> : '';
diff --git a/components/alert/index.md b/components/alert/index.md
index 4de86d8726..2bfd093a55 100644
--- a/components/alert/index.md
+++ b/components/alert/index.md
@@ -10,6 +10,7 @@
 ## 何时使用
 
 - 当系统需要向用户显示警告的信息时。
+- 始终展现，不会自动消失，用户可以点击关闭。
 
 ## API