如何解决UseState仅在第二次单击时显示
我在单击表单提交按钮时使用React useState钩子更新状态,该状态直到第二次单击才更新。相信我需要使用useEffect,但不确定如何通过onClick实施。
(split '(a b a c) 0)
=> '(() (a b a c))
(split '(a b a c) 2)
=> '((a b) (a c))
解决方法
如评论中所述; useState是一个异步函数,因此不能保证您在再次获取新值时会得到新值。这是出于性能考虑,允许批量处理多个状态更改。
在同一方法中继续使用新值的最简单方法是将其保存到变量中,如下所示:
const [clicked,setClicked] = useState(false);
function onclick(e) {
setClicked(true);
if (clicked) { //this goes wrong as clicked likely isn't updated yet
//do something
}
}
const [clicked,setClicked] = useState(false);
function onclick(e) {
const newClicked = true;
setClicked(newClicked);
if (newClicked) { //using the variable garantuees you'll get the value you want
//do something
}
}
,
我实现了useEffect来设置hasError状态
useEffect(() => {
const hasErrors = Object.keys(fieldName).filter(
(key) => fieldName[key].error
);
if (!hasErrors.length) {
setFormHasError(() => true);
}
},[fieldName]);
然后我可以在代码中使用以下内容
if (formHasError) {
return;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。