首页 > 解决方案 > react-native 中未触发方法

问题描述

我是 react-native 的新手,所以请帮助我。

假设我有 2 个屏幕。屏幕 A 和屏幕 B。在屏幕 A 中Geolocation.watchPosition(),每 20 秒使用一次获取位置。当我导航到屏幕 B 时,仍在获取位置。假设我在 redux 中更新了一个值并且位置服务停止了。稍后我更新了 redux 值,以便可以恢复位置服务。redux 值已更新,但位置服务未恢复。请记住,那时我可能在屏幕 B 中。

componentWillReceiveProps(nextProps, nextState) {
if (nextProps.updateServices != this.props.updateServices) {
   if ( this.props.updateServices === Y) {
     __DEV__ && console.log("HERE HERE");
     this.gpsInterval = setInterval(() => {
       Geolocation.getCurrentPosition(info => {
         const latitude = info.coords.latitude;
         const longitude = info.coords.longitude;
         RouteData.latitude = latitude;
         RouteData.longitude = longitude;
         this.props.updateUserLocation({ latitude, longitude });
         this.setState(
           {
             latitude: latitude,
             longitude: longitude,
             latitudeDelta: 0.005,
             longitudeDelta: 0.01,
             showLocationStatus: false
           },
           () => {
             this.gotLocation = true;
             clearInterval(this.gpsInterval);
             if (!this.venueDone) this.getAllVenues(latitude, longitude);
           }
         );
       });
     }, 3000);
   }
 }
}

这就是我尝试从屏幕 B 更新屏幕 A 中的位置服务的方式。我正在获取日志HERE HERE,但未检测到位置更改。

编辑 1

屏幕 A

    class HomeMapView extends React.Component {
        constructor(props) {
            super(props);
            this.state = {
                showLocationStatus: true
            };

        }

        getCurrentPosition = (currentLatitude, currentLongitude) => {
            console.log("Lat: " + currentLatitude + " Long: " + currentLongitude);
            RouteData.latitude = currentLatitude;
            RouteData.longitude = currentLongitude;
            this.props.updateGpsPosition({
                latitude: currentLatitude,
                longitude: currentLongitude
            });
            // if (!this.venueDone) {
            // this.setState(
            //   {
            //     latitude: currentLatitude,
            //     longitude: currentLongitude,
            //     latitudeDelta: 0.005,
            //     longitudeDelta: 0.01
            //   },
            //   () => {
            //     this.getAllVenues(currentLatitude, currentLongitude);
            //   }
            // );
            // }
        };

        enableLocationService() {
            console.log("REACHED HERE");
            this.locationListener = Geolocation.watchPosition(
                    position => {
                    __DEV__ && console.log("LOCATION CHANGED");
                    const latitude = position.coords.latitude;
                    const longitude = position.coords.longitude;
                    this.props.updateUserLocation({
                        latitude,
                        longitude
                    });
                    this.getCurrentPosition(latitude, longitude);
                },
                    error => {
                    console.log("error" + JSON.stringify(error));
                    RNAndroidLocationEnabler.promptForEnableLocationIfNeeded({
                        interval: 20000,
                        fastInterval: 50000
                    })
                    .then(data => {
                        showAlert(
                            "FETCHING ...",
                            "Getting Data Please wait a moment",
                            "success");
                        onCurrentLocationClicked(this.getCurrentPosition);
                    })
                    .catch(err => {
                        showAlert(
                            "GPS Failed",
                            "Problem in enabling GPS please enable gps",
                            "danger");
                    });
                }, {
                    fastestInterval: 10000,
                    interval: 10000,
                    enableHighAccuracy: true,
                    distanceFilter: 0
                });
        }

        disableLocationService() {
            Geolocation.clearWatch(this.locationListener);
        }

        componentDidMount() {
            this.gpsInterval = setInterval(() => {
                    Geolocation.getCurrentPosition(info => {
                        const latitude = info.coords.latitude;
                        const longitude = info.coords.longitude;
                        RouteData.latitude = latitude;
                        RouteData.longitude = longitude;
                        this.props.updateUserLocation({
                            latitude,
                            longitude
                        });
                        this.setState({
                            latitude: latitude,
                            longitude: longitude,
                            latitudeDelta: 0.005,
                            longitudeDelta: 0.01,
                            showLocationStatus: false
                        },
                            () => {
                            this.gotLocation = true;
                            clearInterval(this.gpsInterval);
                            if (!this.venueDone)
                                this.getAllVenues(latitude, longitude);
                        });
                    });
                }, 3000);

        }

        componentWillReceiveProps(nextProps, nextState) {
            if (nextProps.locationService != this.props.locationService) {
                if (nextProps.locationService === "Y") {
                    __DEV__ && console.log("LOCATION SERVICE ENABLED");
                    this.enableLocationService();
                } else if (nextProps.locationService === "N") {
                    __DEV__ && console.log("LOCATION SERVICE DISABLED");

                    this.disableLocationService();
                }
            }
            //added to enable location services after exit venue
            if (nextProps.enterVenue != this.props.enterVenue) {
                if (!nextProps.enterVenue && this.props.locationService === Y) {
                    __DEV__ && console.log("HERE HERE");
                    this.gpsInterval = setInterval(() => {
                            Geolocation.getCurrentPosition(info => {
                                const latitude = info.coords.latitude;
                                const longitude = info.coords.longitude;
                                RouteData.latitude = latitude;
                                RouteData.longitude = longitude;
                                this.props.updateUserLocation({
                                    latitude,
                                    longitude
                                });
                                this.setState({
                                    latitude: latitude,
                                    longitude: longitude,
                                    latitudeDelta: 0.005,
                                    longitudeDelta: 0.01,
                                    showLocationStatus: false
                                },
                                    () => {
                                    this.gotLocation = true;
                                    clearInterval(this.gpsInterval);
                                    if (!this.venueDone)
                                        this.getAllVenues(latitude, longitude);
                                });
                            });
                        }, 3000);
                }
            }

        }

    }
    const mapStateToProps = state => ({
            locationService: state.settings.locationService,
            enterVenue: state.venues.enterVenues
        });

    const mapDispatchToProps = dispatch => ({
            upateLocationService: data => dispatch(upateLocationService(data)),
        });
    export default connect(
        mapStateToProps,
        mapDispatchToProps)(HomeMapView);

任何帮助表示赞赏。

提前致谢。

标签: reactjsreact-nativereact-navigation

解决方案


推荐阅读