Я пытаюсь выполнить вход с помощью JSON веб-токенов. Прямо сейчас я делаю простую вещь, я просто хочу указать имя пользователя и пароль и, если они верны, в качестве ответа мне нужен консольный журнал с токеном.
Вместо получения токена в консоли все, что я получаю, это изменение http-адреса с http:/localhost:3000/login
на http:/localhost:3000/login?username=username&password=password
Может кто-нибудь объяснить мне, почему это происходит?
Вот мой код:
import React, {useState} from 'react';
import {gql} from 'graphql-tag';
import {Mutation} from 'react-apollo';
import {Button, TextField} from '@material-ui/core';
const LOGIN = gql`
mutation Login($username: String!, $password:String!){
login(username:$username, password:$password){
token
}
}
`;
export default function Login(){
const [formState, setFormState] = useState({
values:{}
})
};
const handleChange = event => {
event.persist();
setFormState( formState => ({
...formState,
values:{
...formState.values,
[event.target.name]:event.target.value
}
}));
};
const handleSubmit = async(event, login)=>{
event.preventDefault();
console.log(formState.values)
login().then(async({data}) => {
localStorage.setItem('token', data.login.token);
})
.catch(function(e){
console.log('Something went wrong');
});
console.log(localStorage.getItem('token'));
}
return (
<Mutation mutation={LOGIN} variables={{username:formState.values.username, password: formState.values.password }}>
{(login, {data}) => (
<div>
<form className="form" onSubmit={handleSubmit, login}>
<TextField
label="Username"
name="username"
onChange={handleChange}
value=formState.values.username
></TextField>
<TextField
label="Password"
name="password"
onChange={handleChange}
value=formState.values.password
></TextField>
<Button type="submit">Login</Button>
</form>
</div>
)}</Mutation>
);
Я хотел бы знать, где моя ошибка, я новичок в React и Javascript