webyonet / react-native-android-location-services-dialog-box

React Native Android Location Services Dialog Box
MIT License
182 stars 50 forks source link

function LocationServiceDialogBox.checkLocationServicesIsEnabled error #51

Closed vohoangankhanh closed 6 years ago

vohoangankhanh commented 6 years ago

this error occur when I run my app on android devices, please help me. Thanks

This is my code

import React, { Component } from "react";
import {
    Text,
    StyleSheet,
    View,
    TouchableOpacity, Platform
} from "react-native";
import LocationServiceDialogBox from "react-native-android-location-services-dialog-box";
// import { platform } from "os";
export default class WelcomeScreen extends Component {
    constructor(props) {
        super(props);

        this.state = {
            latitude: null,
            longitude: null,
            error: null,
            initialPosition: "unknown"
        };
    }
    componentDidMount() {
        navigator.geolocation.getCurrentPosition(
            position => {
                this.setState({
                    latitude: position.coords.latitude,
                    longitude: position.coords.longitude,
                    error: null
                });
            },
            error => this.setState({ error: error.message }),
            { enableHighAccuracy: true, timeout: 20000, maximumAge: 1000 }
        );
        if (Platform.OS === "android")
            LocationServiceDialogBox.checkLocationServicesIsEnabled({
                message:
                    "<h2> Use Location?</h2>This app wants to change your device settings:<br/><br/>Use GPS, Wi-fi, and cell network for location<br/><br/><a href='#'>Learn more</a>",
                ok: "YES",
                cancel: "NO",
                enableHighAccuracy: true,
                showDialog: true,
                openLocationServices: true,
                preventOutSideTouch: false,
                preventBackClick: false
            })
                .then(
                    function(success) {
                        navigator.geolocation.getCurrentPosition(
                            position => {
                                let initialPosition = JSON.stringify(position);
                                this.setState({ initialPosition });
                            },
                            error => console.log(error),
                            {
                                enableHighAccuracy: false,
                                timeout: 20000,
                                maximumAge: 1000
                            }
                        );
                    }.bind(this)
                )
                .catch(error => {
                    console.log(error.message);
                });
        BackHandler.addEventListener("hardwareBackPress", () => {
            LocationServiceDialogBox.forceCloseDialog();
        });
    }
    // onPress = () => {
    //  this.props.navigation.navigate("Login");
    // };
    render() {
        return (
            <View style={styles.container}>
                <Text>WelcomeScreen</Text>
                <Text>Latitude: {this.state.latitude}</Text>
                <Text>Longitude: {this.state.longitude}</Text>
                {this.state.error ? (
                    <Text>Error: {this.state.error}</Text>
                ) : null}
                <Text>Geolocation: {this.state.initialPosition}</Text>
                <TouchableOpacity
                    style={styles.btnLetsGo}
                    onPress={() => this.props.navigation.navigate("Login")}
                >
                    <Text style={styles.txtBtn}>Let's GO!</Text>
                </TouchableOpacity>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        alignItems: "center",
        justifyContent: "center",
        backgroundColor: "cyan"
    },
    btnLetsGo: {
        justifyContent: "center",
        alignItems: "center",
        backgroundColor: "#ffcc00"
    }
});
TypeError: undefined is not an object (evaluating '_reactNativeAndroidLocationServicesDialogBox2.default.checkLocationServicesIsEnabled')

This error is located at:
    in WelcomeScreen (at SceneView.js:17)
    in SceneView (at CardStack.js:455)
    in RCTView (at View.js:60)
    in View (at CardStack.js:454)
    in RCTView (at View.js:60)
    in View (at CardStack.js:453)
    in RCTView (at View.js:60)
    in View (at createAnimatedComponent.js:154)
    in AnimatedComponent (at Card.js:12)
    in Card (at PointerEventsContainer.js:39)
    in Container (at CardStack.js:498)
    in RCTView (at View.js:60)
    in View (at CardStack.js:414)
    in RCTView (at View.js:60)
    in View (at CardStack.js:413)
    in CardStack (at CardStackTransitioner.js:67)
    in RCTView (at View.js:60)
    in View (at Transitioner.js:142)
    in Transitioner (at CardStackTransitioner.js:19)
    in CardStackTransitioner (at StackNavigator.js:41)
    in Unknown (at createNavigator.js:13)
    in Navigator (at createNavigationContainer.js:226)
    in NavigationContainer (at App.js:8)
    in App (at registerRootComponent.js:35)
    in RootErrorBoundary (at registerRootComponent.js:34)
    in ExpoRootComponent (at renderApplication.js:33)
    in RCTView (at View.js:60)
    in View (at AppContainer.js:102)
    in RCTView (at View.js:60)
    in View (at AppContainer.js:122)
    in AppContainer (at renderApplication.js:32)
chakrihacker commented 6 years ago

Restart the app, if still not working try to uninstall and install

vohoangankhanh commented 6 years ago

@chakrihacker still not working

webyonet commented 6 years ago

@vohoangankhanh

-- restart your PC or MAC (for background process) -- uninstall your app on mobile device

folow the steps below at the terminal step by step :

1) react-native unlink react-native-android-location-services-dialog-box
2) npm uninstall react-native-android-location-services-dialog-box
3) npm install react-native-android-location-services-dialog-box --save
4) react-native link react-native-android-location-services-dialog-box
5) react-native run-android
vohoangankhanh commented 6 years ago

@webyonet Thank you for your solution, I use npm start command, not react-native run-android. Because when I run-android it shows error about register something.

After doing this, the error still there without any change