Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

250
Views
How use navigation event to reload in react native

I have homeScreen , this screen has useEffect and data filteration has in it. HomeScreen to profilescreen and data update in profile screen and return to homescreen. this updated data need to show in homescreen. I want to know is can navigation event focus reload this homescreen? How can make this

 useEffect(()=>{

     let unsub;

     const fetchCard = async ()=>{
            
      // // user
           const uRef = query(doc(db,'users',user.uid))
           const udata = await getDoc(uRef)
          .then((snapshot)=>snapshot.data())

      //     console.log(udata.age)
         
      // //users

      //     const usRef = query(collection(db,'users'))
      //     const usdata =await getDocs(usRef)
      //     .then((snapshot)=>snapshot.docs.map(doc=>({
      //       id:doc.id,
      //       ...doc.data()
      //     })))

      //     console.log(usdata[0].age)


      const swipeRef = collection(db,'users',user.uid,'swipes')
      const myswipeid = await getDocs(swipeRef)
      .then((snapshot)=>snapshot.docs.map(doc=>doc.id))
      
     
      const swipeuserId = myswipeid.length>0?myswipeid :['test'];
     
 
  
      unsub = onSnapshot(query(collection(db,'users'),where('gender','==',udata.interestIn),where("id","not-in",[...swipeuserId])),
            snapshot=>{
                    setProfiles(
                      snapshot.docs
                     
                      .map(doc=>({
                        id :doc.id,
                        ...doc.data()
                      })
                     
                     )
                    )
                  }
      )
     }
     fetchCard()
     return unsub
  },[setProfiles])
   


how can reload this useEffect by navigation back. can someone show me example

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

If you using react native navigation then use useFocusEffect https://reactnavigation.org/docs/function-after-focusing-screen/ this hook call when you come back to the screen(when the current screen is visible or focused)

import { useFocusEffect } from '@react-navigation/native';

useFocusEffect(()=>{

 let unsub;

 const fetchCard = async ()=>{
        
  // // user
       const uRef = query(doc(db,'users',user.uid))
       const udata = await getDoc(uRef)
      .then((snapshot)=>snapshot.data())

  //     console.log(udata.age)
     
  // //users

  //     const usRef = query(collection(db,'users'))
  //     const usdata =await getDocs(usRef)
  //     .then((snapshot)=>snapshot.docs.map(doc=>({
  //       id:doc.id,
  //       ...doc.data()
  //     })))

  //     console.log(usdata[0].age)


  const swipeRef = collection(db,'users',user.uid,'swipes')
  const myswipeid = await getDocs(swipeRef)
  .then((snapshot)=>snapshot.docs.map(doc=>doc.id))
  
 
  const swipeuserId = myswipeid.length>0?myswipeid :['test'];
 


  unsub = onSnapshot(query(collection(db,'users'),where('gender','==',udata.interestIn),where("id","not-in",[...swipeuserId])),
        snapshot=>{
                setProfiles(
                  snapshot.docs
                 
                  .map(doc=>({
                    id :doc.id,
                    ...doc.data()
                  })
                 
                 )
                )
              }
  )
 }
 fetchCard()
 return unsub

},[])

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!