Je voudrais lire les informations utilisateur et définir la variable "Admin" sur oui si ses attributs personnalisés sont égaux à 1. Le problème est que lorsque je veux lire les attributs utilisateur, le programme se bloque avec TypeError: Impossible de lire la propriété "attributs" de non défini "

Voici mon code:

import React, { useState, useEffect } from "react";
import './App.css';
import { Link, withRouter } from "react-router-dom";
import { Nav, Navbar, NavItem, Image } from "react-bootstrap";
import { LinkContainer } from "react-router-bootstrap";
import Routes from "./Routes";
import { Auth } from "aws-amplify";
import logo from './img/download.svg';


function App(props) {
    const [isAuthenticating, setIsAuthenticating] = useState(true);
    const [isAuthenticated, userHasAuthenticated] = useState(false);
    const [userData, setUserData] = useState([]);
    const [isAdmin, setIsAdmin] = useState(true);

    useEffect(() => {
      onLoad();
    }, [],);

    async function handleLogout() {
      await Auth.signOut();
      userHasAuthenticated(false);
      setIsAdmin(false);
      props.history.push("/login");
    }

    async function onLoad() {
      try {
        await Auth.currentSession();
        userHasAuthenticated(true);
        await Auth.currentUserInfo().then(user => setUserData(user));
        if (userData.attributes['custom:isAdmin'] === "1" ) {
          setIsAdmin(true)
        }
      }
      catch(e) {
        if (e !== 'No current user') {
        alert(e);
      }
    }

    setIsAuthenticating(false);
  }

return (...)
1
Davide Casillo 4 nov. 2019 à 18:10

2 réponses

Salut Il semble que dans la fonction await, vous définissez la valeur de userData à l'intérieur de then, mais à l'extérieur, vous accédez à userData.attributes.

Donc, peut-être que lorsque vous vérifiez userData.attributes, les données utilisateur n'ont pas été renseignées car elles sont asyncronous. Au lieu de les définir dans then, vous pouvez affecter la réponse en tant que nouvelle variable à l'aide de {{ X3}}, il exécutera donc simplement le code suivant lorsque le code async aura été exécuté.

const user = await Auth.currentUserInfo();

if(user.attributes['custom:isAdmin'] === "1" ) {
  setUserData(user);
  setIsAdmin(true);
}
1
Ricardo Gonzalez 4 nov. 2019 à 15:33

Je suppose que cela se produit parce que setUserData () [fondamentalement setState ()] est une fonction asynchrone et si le bloc s'exécute avant que votre état ait été défini (mis à jour).

Essayez d'utiliser setTimeout ().

await Auth.currentUserInfo().then(user => setUserData(user));
    setTimeout(()=>{
       if(userData.attributes['custom:isAdmin'] === "1" ) {setIsAdmin(true)}
     },0)
0
kapil pandey 4 nov. 2019 à 15:47