[FIXED] How to avoid "Sending 'geolocationDidChange' with no listeners registered" warning in react native?

Issue

I am going to get current location in react native.

I was used below code:

    if(Platform.OS == "android") {
        try {
            const granted = await PermissionsAndroid.request(
                PermissionsAndroid.PERMISSIONS.ACCESS_FINE_LOCATION,
                {
                    'title': 'Location Permission',
                    'message': 'Wichz would like to access your location to get your things.'
                }
            )
            if (granted === PermissionsAndroid.RESULTS.GRANTED) {
                // console.warn("You can use locations ")
            } else {
                // console.warn("Location permission denied")
            }
        } catch (err) {
            // console.warn(err)
        }
    }
    this.watchID = navigator.geolocation.watchPosition((position) => {
        this.setState({
            selectedLat: position.coords.latitude,
            selectedLng: position.coords.longitude
        });
        Global.selectedLat = position.coords.latitude;
        Global.selectedLng = position.coords.longitude;
        this.getcurrent_address(position.coords.latitude, position.coords.longitude);
    }, (error)=>console.log(error.message),
    {enableHighAccuracy: false, timeout: 3, maximumAge: 1, distanceFilter: 1}
    );

And add Location usage description like below in ios project:

It works well on both ios and android, but I have get warning box like below:

How can avoid this warning box? Thanks

Solution

It's probably too late now but I'll just detail my experience with this warning for those people in the future that have this same issue.

I encountered this error myself before. For me the cause of this warning is basically that the component is re-rendered before geolocation watchPosition call is fully completed.

In my case, it was because I had multiple fetch calls that caused the component to be re-rendered in quick succession. I fixed it by making geolocation watchPosition only be called on the final render of the component.

Answered By - Matthew Chen
Answer Checked By - Senaida (JavaFixing Volunteer)