How to get the value parameter from a input handler passed into a debounced function in react

Viewed 24

Im using reactjs and trying to find out how to properly pass in the value from my input handler into the debounced function nested inside the input handler. When I console log the parameter, it is one key stroke behind. Meaning at first, it is undefined, then if I enter a 2, it will still be undefined, but then if I enter another key, it will finally say 2 in the console log. Is there anything wrong with this debounced method. Any help is appreciated. Thanks!

    const handleGetSwapPrice = useCallback((pair, side, amount) => {
    console.log(amount)
    getSwapPrice()
      .then((res) => {
        if (!res.price) {
          setIsLoading(true);
        } else {
          setIsLoading(false);
        }
        setSwapPrice(res.price);
      });
  }, [baseAsset, quoteAsset, transactionType, amountState.fromCurrencyAmount]);



  const debouncedAPICall = useCallback(debounce(e => handleGetSwapPrice('BTC/USDT', 'BUY', amountState.fromCurrencyAmount), 800), [amountState]);

And the handler which has the debounced function located in it.

  const handleAssetAmount = (e) => {
    const { value, name } = e.target;
    setAmountState({ ...amountState, [name]: value });
    debouncedAPICall();
  };
0 Answers
Related