Хранить ошибки GraphQL как String - PullRequest
0 голосов
/ 07 марта 2020

У меня есть форма для входа. Когда нажимают кнопку «Отправить», я проверяю через бэкэнд GraphQL правильность адреса электронной почты и пароля. Если да, токен возвращается и сохраняется в локальном хранилище. Время от времени возникают ошибки , такие как:

«Неверный пароль» или «Пользователь не существует».

Есть ли способ сохранить эти ошибки как строки , чтобы я мог отобразить их позже с помощью условного рендеринга?

Вот так выглядит моя мутация:

function submitForm(LoginMutation: any) {
    const { email, password } = state;
    if(email && password){
      LoginMutation({
        variables: {
            email: email,
            password: password,
        },
    }).then(({ data }: any) => {
      localStorage.setItem('token', data.loginEmail.accessToken);
    })
    .catch(console.log)
    }
  }

, и я использую это так в своем возвращении

 return (
      <Mutation mutation={LoginMutation}>
        {(LoginMutation: any) => (
        ....)}>
       </Mutation>
)

Пока я просто показываю единичная ошибка в зависимости от того, существует токен или нет, но я хочу, чтобы моя ошибка указывала c на ошибки GraphQL.

function ShowError(){
  if (!localStorage.getItem('token'))
  {
    console.log('Login Not Successful');
    return <Typography color='primary'>Login Not Successful</Typography>

  }
}

Редактировать:

Пример ошибки:

[Log] Error: GraphQL error: Key (email)=(c@c.com) already exists.

Я пробовал это, но он ничего не регистрирует:

.then(({data, errors}:any) => {
        if (errors && errors.length) {
          console.log('Errors', errors);
          setErrorMessage(errors[0].message);
          console.log('Whats the error', errors[0].message)
        } else {
          console.log('ID: ', data.createUser.id);
        }
      })
    ```
The backend isn't made by me


1 Ответ

1 голос
/ 07 марта 2020

Это зависит от того, как вы настроили несколько вещей, но, если у вас есть доступ к state в вашей функции ShowError:

При использовании GraphQL ошибки могут возникать двумя способами: 1 . Ошибка сети, которая будет обнаружена в .catch. Чтобы справиться с этим, в вашем catch вы можете сохранить сообщение об ошибке в состоянии, а затем получить к нему доступ с ShowError:

...
.catch(err => {
  setState({errorMessage: err.message});
});
В результате неверного запроса, который обычно возвращает успешный ответ с массивом errors. Чтобы справиться с этим делом, вы можете добавить проверку ошибок в .then:
...
.then(({data, errors}) => {
  if (errors && errors.length) {
    setState({errorMessage: errors[0].message});
  } else {
    localStorage.setItem('token', data.loginEmail.accessToken);
  }
});
...