时间戳

首页 > 解决方案 > 在正确获取数据之前，有什么方法可以调用 useEffect 吗？

node.js - 在正确获取数据之前，有什么方法可以调用 useEffect 吗？

问题描述

我想从后端 mongodb 获取我的数据，但 useEffect 只呈现一次，此时数据没有被快速获取，导致很多未定义的错误。这是我的代码：

const [xnaLogData,setXnaLogData]=useState([]);
const [xnaLogMember,setXnaLogMember]=useState("");
const [balance,setBalance]=useState(0);
 
useEffect(() => {
    setXnaLogMember(Cookies.get('member_userr'));
    alert(xnaLogMember);
    const calBal = () => {
        var sum = xnaLogData.reduce(function(prev, current) {
            return prev + +current.balance
        }, 0);
        setBalance(sum);
    }

    const fetchXna = async () => {
        const response = await fetch('/xnaloginforoute');
        const json = await response.json();
        setXnaLogData(json.xnacomp);
        calBal();
        console.log(json.xnacomp)
        console.log(xnaLogData);
    }

    fetchXna();
},[]);

如果我放在},[xnaLogData]);useeffect 行内},[]);，它将启动一个连续的 useeffect 链，并且数据在第 3 次或第 4 次效果尝试中获取。我无法解决这个问题

标签： node.jsreactjsmongodbexpress

解决方案

好的，这是一个典型的useEffect问题。

让我们重新审视一下你的逻辑。

  useEffect(() => {
    setAbc(value)
  }, [abc])

上述问题是一个无限循环，除非value经过几次运行后可以达到稳定值。因此，大多数时候，我们安装了一条短路线来将其断开。

  useEffect(() => {
    if (count > 2) return
    setCount(v => v + 1)
  }, [count])

无论哪种方式，我认为您都明白了，无论是否循环，它都完全由您控制，react 不会决定要做什么。您可以重新考虑为什么要在value更改后重新运行效果。

推荐阅读