首页 > 解决方案 > 反应选择 - 缓冲 onChange 事件

问题描述

我需要暂停 react-select 组件的 onChange ,直到数据加载到选项中。怎么可能?

const handleSearch = () => {
 // call data to redux and add to function getOptions (THIS WORK OK - this doesn't interest me)
}

const handleSelect = () => {
 // need pause event while handleSearch is completed
 // **how to do this**
}

<Select
  ...
  isLoading={isSearching} 
  onInputchange={handleSearch}
  onChange={handleSelect}
  options={getOptions}
  ...
/>

标签: javascriptreactjs

解决方案


创建新状态以检测句柄搜索是否完成。

const [isHandleSearchComplete, markHandleSearchAsComplete] = useState(false);

const handleSearch = () => {
    getOptions().then((res) => {
        // do something here
        markHandleSearchAsComplete(true)
    })
}

const handleSelect = () => {
    // if handle search is complete then stop the process
    if (isHandleSearchComplete) {
        return
    }

    // otherwise, do something
}

推荐阅读