Javascript 在JS中同步调用函数
我想在函数执行后调用React中的APIJavascript 在JS中同步调用函数,javascript,reactjs,async-await,Javascript,Reactjs,Async Await,我想在函数执行后调用React中的API const [isVisible, setVisible] = useState(false); const [isValid, setValidation] = useState(true); const [validationMessage, setValidationMessage] = useState(''); const validate = (callback) => { if (code =
const [isVisible, setVisible] = useState(false);
const [isValid, setValidation] = useState(true);
const [validationMessage, setValidationMessage] = useState('');
const validate = (callback) => {
if (code == null || code.trim().length === 0) {
setValidation(false);
setValidationMessage(translate.signIn.codeErrorMessage);
setVisible(true);
} else if (phoneNumber == null || phoneNumber.trim().length === 0) {
setValidation(false);
setValidationMessage(translate.signIn.phoneErrorMessage);
setVisible(true);
}
callback();
}
const authenticate = async () => {
try {
return await (authenticateUser.get('/abc', {
params: {
code,
phoneNumber,
}
}));
}
catch (e) {
setValidationMessage(translate.signIn.exceptionMessage);
setVisible(true);
}
}
const validateUserCredentials = () => {
if (isValid) {
setActivitySpinner(true);
authenticate().then(response => {
setActivitySpinner(false);
const responseData = response.data;
console.log('responseData', responseData);
if(responseData.status !== 200) {
setVisible(true);
setValidationMessage(responseData.message);
}
else if(responseData.status === 200) {
console.log('success');
}
});
}
}
const onSubmit = () => {
validate(validateUserCredentials);
}
调用“onSubmit”函数时,即使的值有效为假。我可以看到API正在被调用。
我只想在函数validate完成任务后调用函数validateUserCredentials
有人能告诉我我做错了什么吗?Ciao,当然
validateUserCredentials
在validate
之后调用了validateUserCredentials
,您可能会感到困惑,因为在validateUserCredentials
上,您看到是有效的
即使设置为false,仍然是真的。
不幸的是,使用hook时,您不能将callback设置为this.setState,以确定是否有效。您可以做的是:
const validate = (callback) => {
let isvalid_temp = isValid;
if (code == null || code.trim().length === 0) {
setValidation(false);
isvalid_temp = false;
setValidationMessage(translate.signIn.codeErrorMessage);
setVisible(true);
} else if (phoneNumber == null || phoneNumber.trim().length === 0) {
setValidation(false);
isvalid_temp = false;
setValidationMessage(translate.signIn.phoneErrorMessage);
setVisible(true);
}
callback(isvalid_temp);
}
const validateUserCredentials = (isvalid_temp) => {
if (isvalid_temp) {
setActivitySpinner(true);
authenticate().then(response => {
setActivitySpinner(false);
const responseData = response.data;
console.log('responseData', responseData);
if(responseData.status !== 200) {
setVisible(true);
setValidationMessage(responseData.message);
}
else if(responseData.status === 200) {
console.log('success');
}
});
}
}
您的代码必须工作正常,并且您可能会对状态更新的异步性质感到困惑。检查这个答案是否有用