|
@@ -1,6 +1,6 @@
|
|
|
import { Select, Spin } from 'antd'
|
|
|
import type { SelectProps } from 'antd'
|
|
|
-import { useRef, useState, useMemo } from 'react'
|
|
|
+import { useRef, useState, useMemo, useEffect } from 'react'
|
|
|
import debounce from 'lodash/debounce'
|
|
|
|
|
|
export interface DebounceSelectProps<ValueType = any>
|
|
@@ -30,12 +30,12 @@ function DebounceSelect<
|
|
|
const fetchRef = useRef(0)
|
|
|
|
|
|
const debounceFetcher = useMemo(() => {
|
|
|
- const loadOptions = (value: string) => {
|
|
|
+ const loadOptions = params => {
|
|
|
fetchRef.current += 1
|
|
|
const fetchId = fetchRef.current
|
|
|
setState({ ...state, options: [], fetching: true })
|
|
|
|
|
|
- fetchOptions(value).then(newOptions => {
|
|
|
+ fetchOptions(params).then(newOptions => {
|
|
|
if (fetchId !== fetchRef.current) {
|
|
|
// for fetch callback order
|
|
|
return
|
|
@@ -47,6 +47,11 @@ function DebounceSelect<
|
|
|
|
|
|
return debounce(loadOptions, debounceTimeout)
|
|
|
}, [fetchOptions, debounceTimeout])
|
|
|
+ useEffect(() => {
|
|
|
+ if (!state.options?.length && state.val) {
|
|
|
+ debounceFetcher({ ID: state.val })
|
|
|
+ }
|
|
|
+ }, [state.val])
|
|
|
|
|
|
const triggerChange = v => {
|
|
|
setState({ ...state, val: v })
|
|
@@ -64,7 +69,7 @@ function DebounceSelect<
|
|
|
value={state.val}
|
|
|
onChange={triggerChange}
|
|
|
filterOption={false}
|
|
|
- onSearch={debounceFetcher}
|
|
|
+ onSearch={v => debounceFetcher({ search: v })}
|
|
|
notFoundContent={state.fetching ? <Spin size="small" /> : null}
|
|
|
{...props}
|
|
|
options={state.options}
|