linkmore-design
Version:
🌈 🚀lm组件库。🚀
58 lines (55 loc) • 1.82 kB
JavaScript
;
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _ahooks = require("ahooks");
var _react = _interopRequireWildcard(require("react"));
var _input = _interopRequireDefault(require("../../input"));
// 搜索输入框, 增加Ref关闭功能
const DelayInput = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
const inputRef = (0, _react.useRef)(null);
const {
value,
onChange,
onSearch,
...resetProps
} = props;
const [aliveValue, setAliveValue] = (0, _react.useState)(value);
const {
run,
cancel
} = (0, _ahooks.useDebounceFn)((str = '') => typeof onChange === 'function' && onChange?.(str?.trim() || undefined), {
wait: 300
});
// 内容改变触发 => 延迟触发
const handleChange = e => {
e?.persist();
const val = e.target.value;
setAliveValue?.(val);
run(val);
};
// 搜索触发 => 立即触发 & 解除上一次的延迟触发
const handleOnPressEnter = e => {
const excitingVal = e.target.value?.trim() || undefined;
onSearch?.(excitingVal);
cancel();
};
(0, _react.useImperativeHandle)(ref, () => ({
...inputRef.current,
setValue: val => setAliveValue(val)
}));
return /*#__PURE__*/_react.default.createElement(_input.default, (0, _extends2.default)({
ref: inputRef,
allowClear: true,
value: aliveValue,
onChange: handleChange,
onPressEnter: handleOnPressEnter,
size: "middle"
}, resetProps));
});
var _default = DelayInput;
exports.default = _default;