From 59ea12f1726d899ea2d564a4bb143e7d4fe82835 Mon Sep 17 00:00:00 2001
From: afc163 <afc163@gmail.com>
Date: Thu, 20 Aug 2015 11:46:02 +0800
Subject: [PATCH] Fix tag render

---
 components/tag/index.jsx | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/components/tag/index.jsx b/components/tag/index.jsx
index c4c6412435..b4f21cafd3 100644
--- a/components/tag/index.jsx
+++ b/components/tag/index.jsx
@@ -1,14 +1,17 @@
 import React from 'react';
 const prefixCls = 'ant-tag';
+import { transitionEndEvent, addEventListenerOnce } from '../util/index';
 
 class AntTag extends React.Component {
   constructor(props) {
     super(props);
 
     this.state = {
+      closing: false,
       closed: false
     };
   }
+
   close(e) {
     let dom = React.findDOMNode(this);
     dom.style.width = dom.offsetWidth + 'px';
@@ -16,7 +19,13 @@ class AntTag extends React.Component {
     // 重复是去除浏览器渲染bug；
     dom.style.width = dom.offsetWidth + 'px';
     this.setState({
-      closed: true
+      closing: true
+    });
+    addEventListenerOnce(dom, transitionEndEvent, () => {
+      this.setState({
+        closed: true,
+        closing: false
+      });
     });
     this.props.onClose.call(this, e);
   }
@@ -24,12 +33,12 @@ class AntTag extends React.Component {
   render() {
     let close = this.props.closable ?
       <i className="anticon anticon-cross" onClick={this.close.bind(this)}></i> : '';
-    let colorClass = this.props.prefixCls + '-' + this.props.color;
+    let colorClass = this.props.color ? this.props.prefixCls + '-' + this.props.color : '';
 
     let className = this.props.prefixCls + ' ' + colorClass;
-    className = this.state.closed ? className + ' ' + this.props.prefixCls + '-close' : className;
+    className = this.state.closing ? className + ' ' + this.props.prefixCls + '-close' : className;
 
-    return <div className={className}>
+    return (this.state.closed && !this.state.closing) ? null : <div className={className}>
       <a className={this.props.prefixCls + '-text'} {...this.props} />
       {close}
     </div>;