Reactjs useEffect 检查对象的 属性 的值是否发生了变化

Question

我有一个表单，每次表单中的任何输入发生变化时都会触发上下文变化。表单写入一个对象，然后传递给上下文。上下文对象看起来像这样

let form = {
    trialExperationDate: trialExperationDate,
    nextUserDate: nextUserDate,
    linkText: copyText,
    postalCode: formPostal,
    phone: formPhone,
    email: formEmail,
    pwRef: formPwRef
};

最初每个 属性 的值都是 ''。在我的组件中，我想观察对象在上下文 API 中的变化，并在任何字段 !== ''

时增加一个 count 变量

我的代码是这样的。

const [context] = useContext(FormContext);
let numChange = 0;

function isNotEmptyObject(o) {
    Object.keys(o).every(function(x) {
        if(o[x]!==''||o[x]!==null || o[x] !== undefined) {
            numChange += 1
        }
    });
}

useEffect(() => {
    isNotEmptyObject(context)
}, [context]);

问题是，numchange 总是保持在 0。为什么？我已确认正在更新上下文中的对象。

Answer 1

当您 return 来自 React.useEffect() 的函数时，它将在卸载时调用该函数。如果您希望它在第一次挂载和上下文更改时触发，请删除 return.