Search code examples
react-nativewhile-loopreact-hookssettimeoutuse-effect

while loop is not working in useEffect hook


I want to get device location in every 7 seconds set set the state with current location values. I am making a while loop in useEffect hook and use setTimeot to wait 7 seconds. But while loop never executes. What is wrong with this approach and how can i solve the problem?

const sleep = (milliseconds) => {
    setTimeout(() => { }, milliseconds)
}


const getPosition = () => {
    
        while (true) {
            GetLocation.getCurrentPosition({
                enableHighAccuracy: true,
                timeout: 15000,
            })
                .then(location => {
                    const { latitude, longitude, altitude, accuracy } = location
                    setPosition({ lat: latitude, lon: longitude, alt: altitude, acc: accuracy })
                    alert("latitude: " + latitude + "\nlongitude: " + longitude)
                    setLoading(false)
                })
                .catch(err => alert(err))
            sleep(7000)
        }
          
}


useEffect(() => {
    getPosition()

}, [])

Solution

  • I'm not 100% sur why the whuile(true) doesn't work ... But why don't you use the "setTimeout's brother" setInterval :

    const getPosition = () => {
      GetLocation.getCurrentPosition({
        enableHighAccuracy: true,
        timeout: 15000,
      })
        .then((location) => {
          const { latitude, longitude, altitude, accuracy } = location;
          setPosition({
            lat: latitude,
            lon: longitude,
            alt: altitude,
            acc: accuracy,
          });
          alert('latitude: ' + latitude + '\nlongitude: ' + longitude);
          setLoading(false);
        })
        .catch((err) => alert(err));
    };
    
    useEffect(() => {
      const intervalID = setInterval(getPosition, 7*1000);
    
      // Don't forget to clear the interval when unmounting the component :
      return () => {
        clearInterval(intervalID);
      };
    }, []);