React-hooks / Asyn c вызов продолжает сбрасывать состояние

Question

У меня есть вход для поиска, и handleSearchQuery включен. c. и эта функция имеет setTimeout с .4s для ожидания пользовательских типов. Проблема, с которой я сталкиваюсь, заключается в том, что эта функция поиска (которая имеет диспетчеризацию asyn c) продолжает рендеринг этого компонента и устанавливает searchState.searchQuery в пустую строку.

  const [searchState, setSearchState] = useState({
    searchQuery: '',
    typingTimeout: 0,
  })

  const handleSearchQuery = (event: ChangeEvent<HTMLInputElement>) => {
    const { typingTimeout } = searchState
    const trimmedSearchParam = event.target.value.trim()
    if (trimmedSearchParam.length > 1) {
      if (typingTimeout) {
        window.clearTimeout(typingTimeout)
      }
      setSearchState({
        ...searchState,
        searchQuery: trimmedSearchParam,
        typingTimeout: window.setTimeout(() => {
          search(trimmedSearchParam)
        }, 400),
      })
    } else {
      setSearchState({ ...searchState, searchQuery: trimmedSearchParam })
    }
  }

  const search = (trimmedSearchParam: string) => {
    const { program, frequency, endDate, invoiceStatus } = appliedFilters
    const filters = {
      invoiceStatus,
      program,
      frequency,
      endDate: endDate,
      searchText: trimmedSearchParam,
    }
    dispatch(getPaginatedAccountsAsync(5, 0, filters))
  }

снова, handleSearchQuery в настоящее время используется при вводе текста onchange. У вас есть идеи, почему происходит сброс ...?

Не стесняйтесь спрашивать больше кодов / деталей. Спасибо.