Feat timepicker clearicon (#14556)

*  custom clearIcon for time-picker

* 📝 update readme
This commit is contained in:
Cheng 2019-02-01 15:55:03 +08:00 committed by zombieJ
parent 9549353073
commit 27f926fe93
3 changed files with 12 additions and 3 deletions

View File

@ -46,6 +46,7 @@ import moment from 'moment';
| popupStyle | style of panel | object | - |
| secondStep | interval between seconds in picker | number | 1 |
| suffixIcon | The custom suffix icon | ReactNode | - |
| clearIcon | The custom clear icon | ReactNode | - |
| use12Hours | display as 12 hours format, with default format `h:mm:ss a` | boolean | false |
| value | to set time | [moment](http://momentjs.com/) | - |
| onChange | a callback function, can be executed when the selected time is changing | function(time: moment, timeString: string): void | - |

View File

@ -53,6 +53,7 @@ export interface TimePickerProps {
popupClassName?: string;
popupStyle?: React.CSSProperties;
suffixIcon?: React.ReactNode;
clearIcon?: React.ReactNode;
}
export interface TimePickerLocale {
@ -164,11 +165,17 @@ class TimePicker extends React.Component<TimePickerProps, any> {
}
renderClearIcon(prefixCls: string) {
const {} = this.props;
const { clearIcon } = this.props;
const clearIcon = <Icon type="close-circle" className={`${prefixCls}-clear`} theme="filled" />;
const clearIconPrefixCls = `${prefixCls}-clear`;
return clearIcon;
if (clearIcon && React.isValidElement<{ className?: string }>(clearIcon)) {
return React.cloneElement(clearIcon, {
className: classNames(clearIcon.props.className, clearIconPrefixCls),
});
}
return <Icon type="close-circle" className={clearIconPrefixCls} theme="filled" />;
}
renderTimePicker = (locale: TimePickerLocale) => (

View File

@ -47,6 +47,7 @@ import moment from 'moment';
| popupStyle | 弹出层样式对象 | object | - |
| secondStep | 秒选项间隔 | number | 1 |
| suffixIcon | 自定义的选择框后缀图标 | ReactNode | - |
| clearIcon | 自定义的清除图标 | ReactNode | - |
| use12Hours | 使用 12 小时制,为 true 时 `format` 默认为 `h:mm:ss a` | boolean | false |
| value | 当前时间 | [moment](http://momentjs.com/) | 无 |
| onChange | 时间发生变化的回调 | function(time: moment, timeString: string): void | 无 |