从另一个“UseEffect”“调用”UseEffect

Question

我正在学习 React Native，我正在编写一个简单的应用程序来记录每天的睡眠时间。

当按下添加新寄存器的按钮时，我会这样做

onPress={() => setUpdateAction(true)}

这会改变 updateAction 的值：

const [updateAction, setUpdateAction] = useState(false);

当 updateAction 的值改变时，这将被执行：

useEffect(() => {

    ... code that add's the register to an array

    setviewInfoAction(true);
    setUpdateAction(false);
}, [updateAction]);

在里面我调用setviewInfoAction(true);，因为我想用插入的值更改显示的值。

const [viewInfoAction, setviewInfoAction] = useState(false);


useEffect(() => {
        console.log("CALLED");
        var seted = false;
        for (var i = 0; i < registSleep.length; i++) {
            if (
                registSleep[i].day === selectedDay &&
                registSleep[i].month === selectedMonth &&
                registSleep[i].year === selectedYear
            ) {
                setSelectedDayHours(registSleep[i].hours);
                seted = true;
            }
        }
        if (!seted) {
            setSelectedDayHours(0);
        }
        setviewInfoAction(false);
    }, [viewInfoAction]);

这样做我期望执行第二个 UseEffect 但它不是......

Answer 1

您设置 useEffect 的方式只有在 selectedDay 更改时才会重新运行。如果你想让它在执行setInfoViewAction 时运行，请将viewInfoAction 添加到依赖项中。

更好，因为所有这些都与同一个副作用相关的逻辑。我会通过删除第二个useEffect 并将其中的代码添加到第一个useEffect 中来简化您的代码。这主要是因为您可以将所有相关的副作用逻辑放在一起。