我想在执行完一个函数后调用 React 中的 API。

    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”函数时，即使 isValid 的值为 false。我也可以看到 API 正在被调用。 我想仅在函数 validate 完成其任务后调用函数 validateUserCredentials 。

有人能告诉我我在这里做错了什么吗？