Попытка держать пользователя вошедшим с помощью firebase auth в Reactionjs

Question

У меня есть приложение реакции, использующее firebase для аутентификации и других инструментов.На определенной странице я проверяю, вошел ли пользователь с помощью firebase.auth().currentUser;, а также попытался с помощью firebase.auth().onAuthStateChanged, но он перенаправляет меня на страницу входа, показывая, что я не вошел, тогда как я только что вошел.

Здеськод для того, что я пробовал до сих пор:

const [user, setUser] = React.useState(firebase.auth().currentUser);

  firebase.auth().onAuthStateChanged(function(user) {
    if (user) {
      setUser(user);
    }
  })

  React.useEffect(() => {
    firebase.auth().onAuthStateChanged(function(user) {
      if (user) {
        setUser(user);
      }
    })
  });
return(

    <Styles>
    { user ?
      <Paper className={clsx(classes.root, "Paper")}>

        <div className="overlay"></div>

        <Container maxWidth="lg">

          <HeaderTypography variant="h2" color="" gutterBottom>
            Create an Event
          </HeaderTypography> : <Redirect to="/login"/> }

Даже после входа в систему, когда я захожу на эту страницу, я все еще перенаправлен .. Любая помощь будет приветствоваться

Answer 1

Убедитесь, что у вас есть все конечные теги вашего компонента.Также есть паратез, обернутый вокруг основного компонента Paper.Код ниже будет работать.Например:

function App() {
  const [user, setUser] = React.useState(null);
  useEffect(() => {
    firebase.auth().onAuthStateChanged(async(userData) => {
      console.log(userData);
      if (userData) {
         setUser(userData);
      } else {
        setUser(null);
      }
    });
  }, []);

  return (
    user ?
    (<Paper className={clsx(classes.root, "Paper")}>

        <div className="overlay"></div>

        <Container maxWidth="lg">

          <HeaderTypography variant="h2" color="" gutterBottom>
            Create an Event
          </HeaderTypography>
        </Container>
    </Paper>) :
    <Redirect to="/login"/>

  );
}