ReactJS：我如何知道哪个依赖项使 useEffect 挂钩运行/触发？答案

【问题标题】：ReactJS: How do I know which dependency made the useEffect hook run/trigger?ReactJS：我如何知道哪个依赖项使 useEffect 挂钩运行/触发？
【发布时间】：2020-12-12 01:48:05
【问题描述】：

代码示例：

useEffect(() => {

//I want to know which was the variable which made the useffect run. var1 or var2. how can I?

}, [var1, var2]);

使用哪个依赖项让它运行？

【问题讨论】：

标签： reactjs dependencies effect

【解决方案1】：

在没有第三方库和大量代码的情况下实现所需结果的最简单方法是将useEffect 拆分为两个useEffect 挂钩和一个处理程序。

解决方案 1

const handler = () => {
    // ...some logic
};

useEffect(() => {
    // var1 has been changed
    handler();
}, [var1]);

useEffect(() => {
    // var2 has been changed
    handler();
}, [var2]);

解决方案 2

使用useRef保持之前的状态，然后比较结果。

const prevVar1 = useRef();
const prevVar2 = useRef();

useEffect(() => {
    if(prevVar1.current !== var1) {
        // var1 has been changed
    }
    if(prevVar2.current !== var2) {
        // var2 has been changed
    }

    // and update the previous state
    prevVar1.current = var1;
    prevVar2.current = var2;

    // ...some logic
}, [var1, var1]);

解决方案 3

或使用use-what-changed 库

【讨论】：