graphql-request react onClick 处理程序的问题

问：

1. 我正在使用 graphql-request 在 react 应用程序的 onClick 处理程序中执行突变

2. 突变成功执行（我可以通过查看后端的日志来验证）。

3. gqlClient.request 后面的 onClick 处理程序 （loginHandler） 中的代码永远不会执行（console.log 或 alert）

这是代码，知道我做错了什么......

import { useState, useContext } from'react';
import { gql, GraphQLClient } from 'graphql-request';

    const LoginForm = () => {
        const [email, setEmail] = useState('');
        const [password, setPassword] = useState('');
    
        const LOGIN_MUTATION = gql`
            mutation LoginUser($loginArgs: LoginArgs) {
                loginUser(loginArgs: $loginArgs) { sts msg sessionid }
        }`;
    
        const gqlClient = new GraphQLClient(getGqlUrl());
    
        const loginHandler = async () => {
            let resp;
            try {
                resp = await gqlClient.request(LOGIN_MUTATION, { "loginArgs": { "email": `${email}`, "password": `${password}` } });
            } catch(err) {
                 alert(`error - ${JSON.stringify(err)}`);
            }
            alert(`${JSON.stringify(resp)}`);
            console.log(`${JSON.stringify(resp)}`);
        }
        
        return (
            <form style={formStyle}>
                <label style={{ justifySelf: 'right'}}>Email:</label>
                <input type="text" onChange={(e) => setEmail(e.target.value)} />
                <label style={{ justifySelf: 'right'}}>Password:</label>
                <input type="text" onChange={(e) => setPassword(e.target.value)} />
                <button style={buttonStyle} onClick={loginHandler}>
                    Login
                </button>
            </form>
        )
    }