правильный способ установить asyn c тайм-аут при получении данных в реакции, используя useEffect / useState, только после успешной предыдущей выборки

Question

В настоящее время я извлекаю данные, которые были успешно отреагированы из API с асинхронным c / await, и таймаутом после каждой успешной выборки для повторной выборки данных. Однако я получаю предупреждение:

Line 14:6: React Hook useEffect has a missing dependency: 'getData'. Either include it or remove the dependency array react-hooks/exhaustive-deps

Это мой текущий код:

import React, { useState, useEffect } from 'react';
import * as CONSTANTS from '../../constants/myConstants';

function MyPage() {

  const [myData, setMyData] = useState(null);

  useEffect(() => {
    const fetchDataTimeout = setTimeout(() => {
      getData();
    }, CONSTANTS.UPDATE_TIME);
    return () => clearTimeout(fetchDataTimeout);
  }, [myData]);

  async function getDataAsync() {
    console.log('get data async');
    try {
      const response = await fetch(CONSTANTS.PROXY_URL + CONSTANTS.API_URL, {
        headers: {
          'Access-Control-Allow-Origin': '*',
          'Content-Type': 'application/json',
          'Authorization': `Token ${CONSTANTS.API_TOKEN}`,
        }
      });
      console.log(response);
      return response;
    } catch (error) {
      console.error(error);
    }
  }

  function getData() {
    console.log('get data');
    getDataAsync().then((response) => {
      console.log(response.status); //success?
      if (response.status === CONSTANTS.TOO_MANY_REQUESTS_CODE) {
        handleTooManyRequests();
      } else {
        response.json().then(data => {
          console.log('data:',data);
          if (data.data) {
            handleDataSuccess(data.data);
          } else {
            handleOtherError();
          }
        });
      }
    });
  }

  function handleDataSuccess(data) {
    setMyData(data);
    console.log(myData);
  }

  function handleOtherError(){
    console.error('other error');
  }

  function handleTooManyRequests(){
    console.error('too many requests');

  }

  return (
    <div>
      My Page
    </div>
  );
}

export default MyPage;

Я знаю, что могу исправить эту ошибку, если переместить getData функция внутри хука useEffect. Но тогда он будет жаловаться на вызов этой функции (handleDataSuccess()).

Как мне структурировать это с помощью useEffect и useState, чтобы я мог получать новые данные по истечении заданного количества времени, но только после изменения существующего myData?