Estoy tratando de establecer la propiedad .displayName de un usuario, justo después de crearlo.
El problema: el usuario necesita algo de tiempo para crearse, por lo que no funcionaría usar .updateProfile() justo después de llamar a .createUserWithEmailAndPassword() . Entonces, ¿cómo puedo eventualmente actualizar el .displayName justo después de la creación?
Ahora mismo estoy intentando de esta manera:
export function signup(currentUser, email, password) { createUserWithEmailAndPassword(auth, email, password) updateProfile(currentUser, {displayName : "some name"}) } Cuando llamo a la función, uso esta función para el valor de currentUser
export function useAuth() { const [ currentUser, setCurrentUser ] = useState(); useEffect(() => { const unsub = onAuthStateChanged(auth, user => setCurrentUser(user)); return unsub; // Cleaning Function }, []) return currentUser; }Los createUserWithEmailAndPassword() y updateProfile() son asincrónicos y devuelven una Promesa. Por lo tanto, debe encadenar las Promesas o usar async/await como lo menciona Scott en su comentario.
1/ Encadena las Promesas
export function signup(currentUser, email, password) { createUserWithEmailAndPassword(auth, email, password) .then(userCredential => { updateProfile(userCredential.user, {displayName : "some name"}) }) } 2/ Usar async/await
export async function signup(currentUser, email, password) { const userCredential = await createUserWithEmailAndPassword(auth, email, password); await updateProfile(userCredential.user, {displayName : "some name"}) }Debe llamar a updateProfile(currentUser, {displayName : currentUser.displayName}) después de que currentUser haya sido actualizado por el enlace useAuth
useEffect(() =>{ if ('userName' in currentUser && currentUser.userName !== '') { updateProfile(currentUser, {displayName : currentUser.userName}) } }, [currentUser])