Обработка ошибок мутации graphQL с помощью перехватчиков React (useMutation + Apollo-client)

я не могу показать ошибки, если не удалось войти в систему ...

import React from 'react';
import {useMutation, gql} from '@apollo/client';

const LOGIN = gql`
    mutation login($userID: String!, $password: String!) {
        login(userID: $userID, password: $password) {
            id
            name
            theme
            lang
            userID
            token
        }
    }
`;

export default function Login() {
    const [state, setState] = React.useState({
           errorMessege: '',
           userID: '',
           password: '',
    });

    const [loginMutation] = useMutation(LOGIN, {
        update(proxy: any, result: any) {
            login(result.data.login);
        },
        variables: {
            userID: state.userID,
            password: state.password,
        },
    });


    return (
        <div>
           // show error here...
        </div>
    );
}

Я не знаю, следует ли мне использовать react-hooks, потому что здесь был другой ответ:

Обработка ошибок мутации клиента Apollo

он работает нормально ... но обработка ошибок невозможна.


node.js javascript graphql apollo-client mutation
person Community    schedule 28.11.2020    source источник
comment
Поможет ли это apollographql.com/docs/ реагировать / данные / мутации /   -  person Harsha Venkatram    schedule 28.11.2020

Ответы (1)


arrow_upward
1
arrow_downward

Вообще-то все нормально ... ты просто забыл добавить onError!

const [loginMutation] = useMutation(LOGIN, {
        update(proxy: any, result: any) {
            login(result.data.login);
        },
        onError(err: any) {
            // err is for example: "Error: notFound"

            const error = `${err}`.split(':').reverse()[0];
            //this turns ' Error: notFound' to 'notFound'

            setState({
                ...state,
                modalMessege: `${error}`,
            });
        },
        variables: {
            userID: state.userID,
            password: state.password,
        },
    });
person sina    schedule 28.11.2020
comment
const error = ${err}.split (':'). [1]; - person sao; 14.05.2021