Issue
This Content is from Stack Overflow. Question asked by Monzur Adler
I have tried to access the user.email from the email input field , but it remains null
My code :
import React from "react";
import { useState } from "react";
import { useParams } from "react-router-dom";
import UseServiceDetails from "../Hooks/UseServiceDetails";
import { useAuthState } from 'react-firebase-hooks/auth';
import auth from "../../firebase.init";
const Checkout = () => {
const { serviceId } = useParams();
const [service] = UseServiceDetails(serviceId);
// console.log(service);
const [user] = useAuthState(auth);
return (
<div>
<h2 className="text-center">Please checkout <b className="text-danger">{service.name}</b> </h2>
<form className="w-50 mx-auto" action="">
<input className="w-100 mb-2" type="text" value={user.displayName} name="name" placeholder=" name" readonly disabled /> <br />
<input className="w-100 mb-2" type="text" value={user.email} name="email" placeholder="email" /> <br />
<input className="w-100 mb-2" type="text" value={service.name} name="service" placeholder=" service" /> <br />
<input className="w-100 mb-2" type="text" value={user.address} name="address" placeholder=" address" /> <br />
<input className="w-100 mb-2" type="text" value={user.phone} name="phone" placeholder=" phone" /> <br />
<button className="btn btn-danger w-50 d-block mx-auto " type="submit" value="place order">Submit</button>
</form>
</div>
);
};
export default Checkout;
User in my console :
UserImpl {providerId: ‘firebase’, proactiveRefresh: ProactiveRefresh, reloadUserInfo: {…}, reloadListener: null, uid: ‘pFzDIqOeNyca19qJj2uOnaXoI2r1’, …}
accessToken
: * removed to keep short*
auth
:
AuthImpl {app: FirebaseAppImpl, heartbeatServiceProvider: Provider, config: {…}, currentUser: UserImpl, emulatorConfig: null, …}
displayName
:
“Monzur alam”
email
:
null
emailVerified
:
false
isAnonymous
:
false
metadata
:
UserMetadata {createdAt: ‘1663568941792’, lastLoginAt: ‘1663569399378’, lastSignInTime: ‘Mon, 19 Sep 2022 06:36:39 GMT’, creationTime: ‘Mon, 19 Sep 2022 06:29:01 GMT’}
phoneNumber
:
null
Solution
This question is not yet answered, be the first one who answer using the comment. Later the confirmed answer will be published as the solution.
This Question and Answer are collected from stackoverflow and tested by JTuto community, is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.