我一直在使用React 16.7-alpha中的新钩子系统,并且当我正在处理的状态是对象或数组时陷入useEffect的无限循环中。
首先,我使用useState并使用一个空对象启动它,如下所示:
const [obj, setObj] = useState({});
然后,在useEffect中,我再次使用setObj将其设置为空对象。作为第二个参数,我传递了[obj],希望如果对象的 内容 没有更改,它也不会更新。但是它一直在更新。我猜是因为不管内容如何,这些总是不同的对象,这使React认为它不断变化?
useEffect(() => { setIngredients({}); }, [ingredients]);
数组也是如此,但是作为原语,它不会像预期的那样卡在循环中。
使用这些新的挂钩,在检查天气内容是否已更改时,应该如何处理对象和数组?
将空数组作为第二个参数传递给useEffect会使它仅在安装和卸载时运行,从而停止任何无限循环。
useEffect(() => { setIngredients({}); }, []);
我在https://www.robinwieruch.de/react- hooks/上有关React hooks的博客文章中向我阐明了这一点。