#reactjs
#reactjs
Вопрос:
Я не уверен, почему это не работает. При вызове login
функции все работает, кроме строки user = res.headers['access-token'];
. user
остается неопределенным. Моя система аутентификации основана на этом:https://kentcdodds.com/blog/authentication-in-react-applications
import React from 'react';
import axios from 'axios';
const AuthContext = React.createContext();
const url = 'http://localhost:3001/auth/sign_in';
function AuthProvider(props) {
let user;
async function login(e, email, password) {
e.preventDefault();
try {
const res = await axios({
method: 'post',
url: url,
data: JSON.stringify({ email, password }),
headers: { 'Content-Type': 'application/json' }
});
localStorage.setItem('token', res.headers['access-token']);
localStorage.setItem('client', res.headers['client']);
localStorage.setItem('uid', res.headers['uid']);
user = res.headers['access-token'];
console.log('Logged in');
} catch (err) {
console.log(err);
}
}
return (
<AuthContext.Provider
value={{ user, login, logout, register }}
{...props}
/>
);
}
const useAuth = () => React.useContext(AuthContext);
export { AuthProvider, useAuth };
Ответ №1:
Оказывается, все, что мне нужно было сделать, это использовать useState
.
function AuthProvider(props) {
const [user, setUser] = useState();
async function login(e, email, password) {
e.preventDefault();
try {
const res = await axios({
method: 'post',
url: url,
data: JSON.stringify({ email, password }),
headers: { 'Content-Type': 'application/json' }
});
localStorage.setItem('token', res.headers['access-token']);
localStorage.setItem('client', res.headers['client']);
localStorage.setItem('uid', res.headers['uid']);
setUser(res.headers['access-token']);
console.log('Logged in');
} catch (err) {
console.log(err);
}
}
return (
<AuthContext.Provider
value={{ user, login, logout, register }}
{...props}
/>
);
}