ant-design/components/transfer/search.jsx
Bruce Mitchener 71594b0e5c Remove manual binding for 'this'.
Use ES7 style class members for event handlers so that 'this' is
automatically bound and each definition site doesn't need to manually
invoke 'bind'.

This makes all existing ES2015 class usages in components use the
same mechanism for binding.
2016-03-28 20:36:11 +07:00

45 lines
1.0 KiB
JavaScript

import React, { PropTypes } from 'react';
import Icon from '../icon';
function noop() {
}
export default class Search extends React.Component {
handleChange = (e) => {
this.props.onChange(e);
}
handleClear = (e) => {
e.preventDefault();
this.props.handleClear(e);
}
render() {
const { placeholder, value, prefixCls } = this.props;
return (
<div>
<input placeholder={placeholder} className={ `${prefixCls} ant-input` } value={ value } ref="input"
onChange={this.handleChange} />
{ value && value.length > 0 ?
<a href="#" className={ `${prefixCls}-action` } onClick={this.handleClear}>
<Icon type="cross-circle" />
</a>
: <span className={ `${prefixCls}-action` }><Icon type="search" /></span>
}
</div>
);
}
}
Search.defaultProps = {
placeholder: '',
onChange: noop,
handleClear: noop,
};
Search.propTypes = {
prefixCls: PropTypes.string,
placeholder: PropTypes.string,
onChange: PropTypes.func,
handleClear: PropTypes.func,
};