I want to make a get request 2 seconds after the key is pressed on onChange. I'm using useForm and I know it can be done via lodash.throttle but it's not necessary for me. Help me write a function please

this is my get request

const response = await searchContractorsById(data.INN);

<Controller
                  name="inn"
                  control={control}
                  render={({ field: { value, onChange } }) => (
                    <TextField
                      value={value}
                      onChange={onChange}
                      type="number"
                      fullWidth
                      size="small"
                      placeholder="Например, 6163152794"
                      error={!!errors?.inn}
                      helperText={errors?.inn && errors.inn?.message}
                    />
                  )}
                />

CodePudding user response：

In case you wish to do this request at every onChange, you can do something like this:

const handleChange = (event, onChange) => {
        setTimeout(() => {
          searchContractorsById(data.INN)
            .then(() => {...use results here})
            .catch(e => ...)
        }, 2000)
        onChange(event)
      }

<Controller
  name="inn"
  control={control}
  render={({ field: { value, onChange } }) => (
    <TextField
      value={value}
      onChange={(e) => handleChange(e, onChange)}
      type="number"
      fullWidth
      size="small"
      placeholder="Например, 6163152794"
      error={!!errors?.inn}
      helperText={errors?.inn && errors.inn?.message}
    />
  )}
/>