当道具更新速度更快的速度与计时器设置的速度更快时，API呼叫未触发

发布于 2025-02-01 12:14:59 字数 1117 浏览 5 评论 0原文

我的组件内有2种使用效果，其中包括Settimeout和Cleartimeout方法。它们都基于相同的道具进行更新，并且内部的条件是相同的，但是一个设置为每3秒发射一次，另一个应每1分钟发射一次。

我的问题是每分钟都应该更新的问题根本不发射。

我认为每次道具更新时可能会重置（如果我在语句中安装语句时，每次安慰时，我都不确定如何解决此问题，因为道具每次都会更新第一个被解雇。

我的目标是

每3秒钟登录一次终点，直到我得到预期的结果，并
每1分钟记录此事件，以免超载数据库，以一遍又一遍地发送相同的信息。

这些是我的用途：

  useEffect(() => {
    if(!providerData?.providerAvailable ) {

      sendMessage({
        code: 'NO_PROVIDER_AVAILABLE',
        value: 'No provider currently available',
      });

      const timerId = window.setTimeout(() => providerRefetch(), 3000);

      return () => window.clearTimeout(timerId);
    } else {
      return;
    }
  }, [providerData]);


  // send No provider event every minute
  useEffect(() => {
    if ( !providerData?.providerAvailable ) {

      const eventId = window.setTimeout(() => sendEvent(), 60000, {
        key: 'NO_PROVIDER_AVAILABLE',
        description: 'No provider currently available',
      });

      return () => window.clearTimeout(eventId);

    } else {
      return;
    }
  }, [providerData]);

原文

I have 2 useEffects inside my component both with setTimeout and clearTimeout methods inside of them. They both update based on the same props and the conditions inside them are the same however one is set to fire every 3 seconds and the other should fire every 1 minute.

My issue is the one that should update every minute is not firing at all.

I think it may be reseting every time the props update (every 3 seconds when i console inside the if statement it is consoling) but im not sure how to work around this since the props will update every time the first one is fired.

My goal here is

To hit an endpoint every 3 seconds until I get an expected result and
Log this event every 1 minute so as not to overload the database sending the same information over and over.

these are my useEffects:

  useEffect(() => {
    if(!providerData?.providerAvailable ) {

      sendMessage({
        code: 'NO_PROVIDER_AVAILABLE',
        value: 'No provider currently available',
      });

      const timerId = window.setTimeout(() => providerRefetch(), 3000);

      return () => window.clearTimeout(timerId);
    } else {
      return;
    }
  }, [providerData]);


  // send No provider event every minute
  useEffect(() => {
    if ( !providerData?.providerAvailable ) {

      const eventId = window.setTimeout(() => sendEvent(), 60000, {
        key: 'NO_PROVIDER_AVAILABLE',
        description: 'No provider currently available',
      });

      return () => window.clearTimeout(eventId);

    } else {
      return;
    }
  }, [providerData]);

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

洒一地阳光 2025-02-08 12:14:59

我没有将第二个使用效率从与第一个使用相同的道具中基于我创建的计数，该计数每次调用第一个时都会增加，而计数更新时第二个使用效应更新：

const [callCount, setCallCount] = useState(0);

 useEffect(() => {
    if (
      providerError ||
      (!providerData?.providerAvailable && providerData?.providerState !== 'engaged')
    ) {
      if (callCount < 21) {
        let count = callCount + 1;
        setCallCount(count);
      } else {
        setCallCount(0);
      }

      sendMessage({
        type: 'EVENT',
        code: 'NO_PROVIDER_AVAILABLE',
        value: 'No provider currently available',
      });

      const timerId = window.setTimeout(() => providerRefetch(), 3000);

      return () => window.clearTimeout(timerId);
    } else {
      return;
    }
  }, [providerData, providerRefetch, providerError]);

  // send No provider event every minute
  useEffect(() => {
    if (callCount === 2) {
      
          sendEvent({
            key: 'NO_PROVIDER_AVAILABLE',
            description: 'No provider currently available',
          })

    } else {
      return;
    }
  }, [callCount]);

Instead of basing my second useEffect off of the same props as the first I created a count that increments up every time the first is called and the 2nd useEffect updates when the count updates:

const [callCount, setCallCount] = useState(0);

 useEffect(() => {
    if (
      providerError ||
      (!providerData?.providerAvailable && providerData?.providerState !== 'engaged')
    ) {
      if (callCount < 21) {
        let count = callCount + 1;
        setCallCount(count);
      } else {
        setCallCount(0);
      }

      sendMessage({
        type: 'EVENT',
        code: 'NO_PROVIDER_AVAILABLE',
        value: 'No provider currently available',
      });

      const timerId = window.setTimeout(() => providerRefetch(), 3000);

      return () => window.clearTimeout(timerId);
    } else {
      return;
    }
  }, [providerData, providerRefetch, providerError]);

  // send No provider event every minute
  useEffect(() => {
    if (callCount === 2) {
      
          sendEvent({
            key: 'NO_PROVIDER_AVAILABLE',
            description: 'No provider currently available',
          })

    } else {
      return;
    }
  }, [callCount]);

回复收藏 0 原文

~没有更多了~