refactor(input-number): rewrite with hook (#23461)

This commit is contained in:
Tom Xu 2020-04-22 09:48:10 +08:00 committed by GitHub
parent 3e22b505a3
commit 4a3e01ff0b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 13 additions and 27 deletions

View File

@ -6,7 +6,7 @@ import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest'; import rtlTest from '../../../tests/shared/rtlTest';
describe('InputNumber', () => { describe('InputNumber', () => {
focusTest(InputNumber); focusTest(InputNumber, true);
mountTest(InputNumber); mountTest(InputNumber);
rtlTest(InputNumber); rtlTest(InputNumber);

View File

@ -35,27 +35,9 @@ export interface InputNumberProps
onPressEnter?: React.KeyboardEventHandler<HTMLInputElement>; onPressEnter?: React.KeyboardEventHandler<HTMLInputElement>;
} }
export default class InputNumber extends React.Component<InputNumberProps, any> { const InputNumber = React.forwardRef<unknown, InputNumberProps>((props, ref) => {
static defaultProps = { const renderInputNumber = ({ getPrefixCls, direction }: ConfigConsumerProps) => {
step: 1, const { className, size: customizeSize, prefixCls: customizePrefixCls, ...others } = props;
};
private inputNumberRef: any;
saveInputNumber = (inputNumberRef: any) => {
this.inputNumberRef = inputNumberRef;
};
focus() {
this.inputNumberRef.focus();
}
blur() {
this.inputNumberRef.blur();
}
renderInputNumber = ({ getPrefixCls, direction }: ConfigConsumerProps) => {
const { className, size: customizeSize, prefixCls: customizePrefixCls, ...others } = this.props;
const prefixCls = getPrefixCls('input-number', customizePrefixCls); const prefixCls = getPrefixCls('input-number', customizePrefixCls);
const upIcon = <UpOutlined className={`${prefixCls}-handler-up-inner`} />; const upIcon = <UpOutlined className={`${prefixCls}-handler-up-inner`} />;
const downIcon = <DownOutlined className={`${prefixCls}-handler-down-inner`} />; const downIcon = <DownOutlined className={`${prefixCls}-handler-down-inner`} />;
@ -75,7 +57,7 @@ export default class InputNumber extends React.Component<InputNumberProps, any>
return ( return (
<RcInputNumber <RcInputNumber
ref={this.saveInputNumber} ref={ref}
className={inputNumberClass} className={inputNumberClass}
upHandler={upIcon} upHandler={upIcon}
downHandler={downIcon} downHandler={downIcon}
@ -88,7 +70,11 @@ export default class InputNumber extends React.Component<InputNumberProps, any>
); );
}; };
render() { return <ConfigConsumer>{renderInputNumber}</ConfigConsumer>;
return <ConfigConsumer>{this.renderInputNumber}</ConfigConsumer>; });
}
} InputNumber.defaultProps = {
step: 1,
};
export default InputNumber;