时间戳

首页 > 解决方案 > 错误调用 API

javascript - 错误调用 API

问题描述

  const [clientIfFromSearchWebitel, setClientIfFromSearchWebitel] = useState(
    undefined
  );


    useEffect(() => {
    console.log('clientIfFromSearchWebitel', clientIfFromSearchWebitel);
    if (clientIfFromSearchWebitel && clientIfFromSearchWebitel !== undefined && clientIfFromSearchWebitel !== '') {

      axios
      .post('https://extapi.megabank.ua/dev/ops/api/v1/getEntity/CASES', {
        filters: [
          {
            comparison: 'eq',
            fieldName: 'client_id',
            fieldValue: clientIfFromSearchWebitel
              ? clientIfFromSearchWebitel
              : undefined,
            operation: 'OR',
          },
        ],
      })
      .then(data => setFilterData(data.data));
    }else {
      axios
      .post('https://extapi.megabank.ua/dev/ops/api/v1/getEntity/CASES', {
        filters: [],
      })
      .then(data => setFilterData(data.data));
    }

  }, [clientIfFromSearchWebitel])

在此处输入图像描述

我有一个clientIfFromSearchWebitel状态，当组件第一次出现时，这个状态是未定义的，当组件再次更新时，值会根据应该调用的API写入它，但是调用API而不是1次- 2次，由于第一次状态未定义，第二次有值，这种情况如何解决？

标签： javascriptreactjsasynchronous

解决方案

我认为您在谈论https://reactjs.org/docs/hooks-faq.html#can-i-run-an-effect-only-on-updates

const fetchNow = useRef(false);

useEffect(() => {
  if (fetchNow.current) {
    // do fetch now -- your existing code
  }
});

你在哪里setClientIfFromSearchWebitel()替换fetchNow.current = true

这样你就可以避免 useState 和 useEffect 中的条件。

推荐阅读