我使用带有钩子的功能性反应组件。
const [loaded, setLoaded] = React.useState(null);
const [title, setTitle] = React.useState(title);
React.useEffect(() => {
//...
fetch('https://jsonplaceholder.typicode.com/todos/1')
.then(response => response.json())
.then(json => {
setLoaded(true);
setTitle(title);
});
}, []);
在这种情况下,组件被渲染两次。一方面,这似乎是合乎逻辑的。
但我在这个组件中也有一个复选框处理程序
const changeHandler = event => {
//...
setTotal(new_total);
setError(false);
};
在这种情况下,虽然状态也改变了 2 次,但不会发生两次渲染。我不明白为什么会这样。
聚苯乙烯
解决这个问题没有问题,我想知道为什么会发生这种情况
更新:
如果我设置 useEffect
setLoaded(true);
setTitle(title);
setTitle2(title);
setTitle3(title);
将是 4 次重新渲染,如果我设置 changeHandler
setTotal(new_total);
setError(false);
setError2(false);
setError3(false);
将是 1 次重新渲染
斯蒂芬大帝
相关分类