这不适用于React组件中的异步功能

Question

在我的React组件this.login()中没有执行。我相信这是因为await function改变了这种情况，但我不确定如何修复它。

           await this.props
                .SignupUser({
                    variables: {
                        email: this.state.email,
                        password: this.state.password,
                        name: this.state.name,
                    },
                })
                .then(() => {
                    this.login();
                })
                .catch(error => {
                    this.setState({ wait: false });
                    const errorMessage = error.graphQLErrors[0].functionError;
                    this.setState({ error: errorMessage });
                });

Answer 1

删除await关键字，它应该有效。

或者，我们需要以不同的方式实施

该函数必须在以下代码的函数声明中添加async关键字

 await this.props
    .SignupUser({
        variables: {
            email: this.state.email,
            password: this.state.password,
            name: this.state.name,
        },
    })
    .then(() => {
        this.login();
    })
    .catch(error => {
        this.setState({ wait: false });
        const errorMessage = error.graphQLErrors[0].functionError;
        this.setState({ error: errorMessage });
    });

（或）

    try {
    const user = await this.props
        .SignupUser({
            variables: {
                email: this.state.email,
                password: this.state.password,
                name: this.state.name,
            },
        });
    this.login();
} catch (e) {
    this.setState({ wait: false });
    const errorMessage = error.graphQLErrors[0].functionError;
    this.setState({ error: errorMessage });
}