test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 11:39:28 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity

Fix tag render

Browse Source
This commit is contained in:
afc163 2015-08-20 11:46:02 +08:00
parent e5419c79ef
commit 59ea12f172
1 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
components/tag/index.jsx
View File

@ -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>;