UNPKG

linkmore-design

Version:

🌈 🚀lm组件库。🚀

54 lines (51 loc) 2.05 kB
import _extends from "@babel/runtime/helpers/esm/extends"; import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2"; import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray"; import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties"; var _excluded = ["value", "onChange", "onSearch"]; import React, { forwardRef, useImperativeHandle, useRef, useState } from 'react'; import Input from "../../input"; import { useDelayedFn } from "../hooks"; // 搜索输入框, 增加Ref关闭功能 var DelayInputSearch = /*#__PURE__*/forwardRef(function (props, ref) { var inputRef = useRef(null); var value = props.value, onChange = props.onChange, onSearch = props.onSearch, resetProps = _objectWithoutProperties(props, _excluded); var _useState = useState(value), _useState2 = _slicedToArray(_useState, 2), aliveValue = _useState2[0], setAliveValue = _useState2[1]; var delayedQuery = useDelayedFn(500); // 内容改变触发 => 延迟触发 var handleChange = function handleChange(e) { e === null || e === void 0 ? void 0 : e.persist(); setAliveValue === null || setAliveValue === void 0 ? void 0 : setAliveValue(e.target.value); delayedQuery(function () { return onChange === null || onChange === void 0 ? void 0 : onChange(e.target.value); }); }; // 搜索触发 => 立即触发 & 解除上一次的延迟触发 var handleSearch = function handleSearch(val) { onSearch === null || onSearch === void 0 ? void 0 : onSearch(val); delayedQuery.cancel(); }; useImperativeHandle(ref, function () { return _objectSpread(_objectSpread({}, inputRef.current), {}, { setValue: function setValue(val) { return setAliveValue(val); } }); }); return /*#__PURE__*/React.createElement(Input.Search, _extends({ ref: inputRef, allowClear: true, value: aliveValue, onSearch: handleSearch, onChange: handleChange }, resetProps, { size: "middle" })); }); export default DelayInputSearch;