предотвратить многократное повторное получение с помощью apollo useLazyQuery - PullRequest
0 голосов
/ 02 февраля 2020

предполагаемое поведение

У меня есть поисковый ввод, когда пользователь вводит слово, я хотел бы подождать 1 с, прежде чем повторно загружать данные с помощью appolo useLazyQuery. однако если до 1 секунды пользователь начинает вводить снова, таймер должен быть сброшен.

, поэтому я использую setTimeOut и clearTimeout, однако я заметил, что appollo отправляет запрос для каждого удара.

есть способ предотвратить многократное повторное получение и отправлять запрос только через 1 с, когда пользователь перестанет набирать


import React, { useState } from 'react'
import {   useLazyQuery } from '@apollo/react-hooks'
import {GET_BUSINESSES} from '../../../qraphQl/businessType'


const  SearchTool = () => {

    const [name, setName] = useState('')
    const [busSug, setBusSug] = useState({busSug:[], showBusSug: false})

    //  prevent sending many hhtp request

    const  [getBusiness , {  loading , data, error }] = useLazyQuery(GET_BUSINESSES)

    let typingWaitTimer = null

    const handleNameChange = (event) => {
        clearTimeout(typingWaitTimer)
        const val = event.target.value
        setName(()=> val)

        typingWaitTimer = setTimeout(() =>  getBusiness( {variables: { query: name }} ) , 1000) 

    }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...