Svelte-Apollo 未发送请求

Question

在我的组件中我正在这样做

//register.svelte
    import { gql } from "@apollo/client";
    import { mutation } from "svelte-apollo";
    import { goto } from "@sapper/app";
    import { userStore } from "../stores/userStore";

    const REGISTER = gql`
        mutation register(
            //variables
        ) {
            register(
                registerInput: {
                    //variables
                }
            ) {
                //variables
            }
        }
    `;
    const register = mutation(REGISTER);

    let firstName = "";
    let lastName = "";
    let email = "";
    let password = "";
    let confirmPassword = "";
    let loading = false;
    let response = {};
    let errors = {};

    async function registerUser() {
        try {
            loading = true;
            response = await register({
                variables: {
                    //variables
                },
            });

            const {
                //variables
            } = response.data.register;

            $userStore = {
                //variables
            };
            loading = false;

            // persisting the token line
            goto("/app/dashboard");
        } catch (err) {
            errors = err;
        }
    }

在我的标记中，我有一个表单，其中嵌套了一个button[type=submit]，并且在提交表单时调用了注册函数。

有一个非常相似的组件，login，它的写法相同，但 Login 工作正常，并且 register 甚至不发送请求。

有什么我可能错过的吗？

我有一个debug 块检查请求对象是否已更改，但它根本没有更改。

编辑 这是我配置客户端的逻辑

import { setContext } from "@apollo/client/link/context";
    // to write gql "import {gql} from '@apollo/client'
    import {
        ApolloClient,
        createHttpLink,
        InMemoryCache,
    } from "@apollo/client";
    import { setClient } from "svelte-apollo";
    import fetch from "cross-fetch";

const httpLink = createHttpLink({
        uri: "validaddresshere",
        fetch,
    });

    const authLink = setContext((_, { headers }) => {
        return {
            headers: {
                ...headers,
                Authorization: localStorage.getItem("token")
                    ? `Bearer ${localStorage.getItem("token")}`
                    : "",
            },
        };
    });

    const client = new ApolloClient({
        link: authLink.concat(httpLink),
        cache: new InMemoryCache(),
    });

编辑 2 问题似乎是我试图访问初始化之前的变量。我已经初始化了。更准确地说，它说我有firstName 作为undefined，即使你可以清楚地看到它是用let firstName = "" 初始化的

Answer 1

感谢@Elan 建议如何找出问题所在。

我必须更改变量的名称才能使其工作。更准确地说。

在我的文件中，我将表单变量初始化为

var firstName = "";
var lastName = "";
var email = "";
var password = "";
var confirmPassword = "";
var loading = false;
var response = {};
var errors = {};

在我的register() 函数中

async function registerUser() {
        try {
            loading = true;

            response = await register({
                variables: {
                    firstName,
                    lastName,
                    email,
                    language: "en-US",
                    password,
                    confirmPassword,
                },
            });

弹出的错误说我在初始化之前无法访问firstName，即使我没有这样做。我不完全明白发生了什么。

Answer 2

您可以尝试几个调试点，是否曾经调用 registerUser()？如果是这样，您的尝试/捕获是否失败？ （我会在 catch 中记录错误以查看是否存在），第三个选项是您的 await register() 一直等待。

尝试登录 registerUser() 函数的第一行和你的 catch 以获得更多信息。