How i can correctly debounce mapDispatchToProps or redux action?

Question

I have redux action:

export const setSearchText = payload => ({
  type: SEARCH_ACTION,
  payload,
});

And following mapDispatchToPros:

const mapDispatchToProps = dispatch => ({
  onChange: (...args) => setSearchText(...args),
});

How i can it debounce?

Answer 1

const mapDispatchToProps = dispatch => ({
  onChange: (...args) =>{
    setTimeout(()=>dispatch(setSearchText(...args)),1000);
  }
});

Here the debounce time is set to 1 sec

Hope this code works

Answer 2

  onChange: (...args) => debounce(() => dispatch(setSearchText(...args)), 500)

This is the debounce function.

const debounce = (func, wait) => {
  let timeout;
  return function() {
    const context = this;
    const args = arguments;
    const later = function() {
      timeout = null;
      func.apply(context, args);
    };
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
  };
}