test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 11:08:45 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

Fix clear icon in RangePicker, close #2252

Browse Source
This commit is contained in:
afc163 2016-07-07 16:28:00 +08:00
parent 4b4a55b003
commit 842b55128f
1 changed files with 16 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/date-picker/RangePicker.jsx
View File

@ -3,6 +3,7 @@ import GregorianCalendar from 'gregorian-calendar';
import RangeCalendar from 'rc-calendar/lib/RangeCalendar';
import RcDatePicker from 'rc-calendar/lib/Picker';
import classNames from 'classnames';
import Icon from '../icon';
export default class RangePicker extends React.Component {
static defaultProps = {
@ -33,6 +34,13 @@ export default class RangePicker extends React.Component {
}
}
clearSelection = (e) => {
e.preventDefault();
e.stopPropagation();
this.setState({ value: [] });
this.handleChange([]);
}
handleChange = (value) => {
const props = this.props;
if (!('value' in props)) {
@ -100,6 +108,13 @@ export default class RangePicker extends React.Component {
/>
);
const clearIcon = (!props.disabled && state.value && (state.value[0] || state.value[1]))
? <Icon
type="cross-circle"
className="ant-calendar-picker-clear"
onClick={this.clearSelection}
/> : null;
return (<span className={props.pickerClass} style={style}>
<RcDatePicker
formatter={props.getFormatter()}
@ -136,6 +151,7 @@ export default class RangePicker extends React.Component {
placeholder={endPlaceholder}
className="ant-calendar-range-picker-input"
/>
{clearIcon}
<span className="ant-calendar-picker-icon" />
</span>
);