fix(Input): listen change event of Input (#1595)

* fix(pagination): remove placeholder of Pagionation Jumper

* fix(Input): listen change event of Input

Co-authored-by: maxin <maxin@growingio.com>

src/input/Input.tsx

@@ -2,6 +2,7 @@ import React, { useCallback, useMemo } from 'react';
 import classNames from 'classnames';
 import { InputProps } from './interface';
 import usePrefixCls from '../utils/hooks/use-prefix-cls';
+import useControlledState from '../utils/hooks/useControlledState';
 
 const Input = React.forwardRef<HTMLSpanElement, InputProps>((props, ref) => {
   const {
@@ -15,11 +16,14 @@ const Input = React.forwardRef<HTMLSpanElement, InputProps>((props, ref) => {
     onPressEnter,
     onKeyPress,
     style,
-    value,
+    value: valueProp,
+    defaultValue,
     inputRef: propsInputRef,
     ...rest
   } = props;
 
+  const [value, setValue] = useControlledState(valueProp, Array.isArray(defaultValue) ? undefined : defaultValue);
+
   const prefixCls = usePrefixCls('input', customizePrefixCls);
   const inputClass = useMemo(
     () =>
@@ -77,6 +81,7 @@ const Input = React.forwardRef<HTMLSpanElement, InputProps>((props, ref) => {
         {...rest}
         value={value ?? ''}
         disabled={disabled}
+        onChange={(event) => setValue(event.target.value)}
         onKeyPress={handleKeyPress}
         placeholder={placeholder}
         ref={propsInputRef}

src/pagination/QuickJumper.tsx

@@ -21,7 +21,6 @@ const QuickJumper: React.FC<{
           max={maxPages}
           size="small"
           className={`${prefixCls}__jumper__input`}
-          placeholder=" "
           onKeyDown={({ key, currentTarget }) => {
             if (key === 'Enter') {
               onQuickGo?.(Number.parseInt(`${currentTarget.value}`, 10));