get user object from api after register or login

Viewed 19

i have a big problem i do a register and login form and i have the APIs, when the user login or register his email go to local storage, and all other info go to database with email , the problem:i want to get user object from api after logging in < i did it by get the email from localstorage and find it in api , but it gives me undefined

export default function Projects() {
  const[data,setData] = useState([])
  const user= localStorage.getItem('email')
  const [userA, setUserA] = useState('')

  
  console.log(localStorage.getItem('email'))
  console.log(user)
  useEffect(()=>{
    fetch("http://127.0.0.1:8000/api/user/show")
      .then(res => res.json())
      .then(data => console.log(data.find(item => item.email !== user )))
    },[])


    const serviceItem = data.map((item) => 
      <Link to ={`/states/${item.id}`} className="col-md-6" >
      
        <div className="card">
          <video width="100%" autoPlay muted>
                <source src={`/uploads/${item.service_video}`} type="video/mp4"/>
          </video>
          <div className="card-body">
            <p className="card-text">{item.service_text_en}</p>
          </div>
        </div>
    </Link>
     )

  return (
    <div className="bg-custom">
      <div className="container" id="services">
        <h1 className="text-center fw-bold mb-4">Services</h1>
          <div className="row">
            { userA  ? serviceItem : <div className="text-center">You Are Not Accepted Yet</div>}
          </div>
      </div>
    </div>

 );
}

i just want the object that the email in localstorage = it, the array of data :

0
: 
{id: 1, name: 'nageeb', email: 'fff@gmail.com', email_verified_at: null, created_at: '2022-09-10T12:18:39.000000Z', …}
1
: 
{id: 2, name: 'very good', email: 'ce@gmail.com', email_verified_at: null, created_at: '2022-09-10T12:22:10.000000Z', …}
2
: 
{id: 3, name: 'good', email: 'test@gmail.coms', email_verified_at: null, created_at: '2022-09-10T13:27:26.000000Z', …}
3
: 
{id: 4, name: 'nageeb', email: 'test@gmail.com', email_verified_at: null, created_at: '2022-09-11T16:19:55.000000Z', …}
4
: 
{id: 5, name: 'nageeb', email: 'ver@gmail.com', email_verified_at: null, created_at: '2022-09-11T16:30:54.000000Z', …}
5
: 
{id: 6, name: 'nageeb', email: 'nice@gmail.com', email_verified_at: null, created_at: '2022-09-11T16:32:33.000000Z', …}
6
: 
{id: 7, name: 'good', email: 'tsest@gmail.coms', email_verified_at: null, created_at: '2022-09-11T16:33:31.000000Z', …}
7
: 
{id: 8, name: 'nageeb', email: 'nag@gmail.com', email_verified_at: null, created_at: '2022-09-11T16:55:49.000000Z', …}
length
: 
8
[[Prototype]]
: 
Array(0)
1 Answers

You need to pass the user in useEffect dependency array. Let me know if it works.

useEffect(()=>{
fetch("http://127.0.0.1:8000/api/user/show")
  .then(res => res.json())
  .then(data => console.log(data.find(item => item.email === user )))
},[user])
Related