navigator.geolocation is not returning the correct location in Android device(react-native)

Question

I am trying to get the current geo location by running the following snippet,

export default class LocationTracking extends Component {
     constructor(props) {
     super(props); 
     this.state = { latitude: '',
                    longitude: ''
                  };
     }
     componentWillMount() {
         navigator.geolocation.getCurrentPosition(    
                function (position) { 
                   this.setState({ latitude: position.coords.latitude, 
                                  longitude: position.coords.longitude 
                               });
                }.bind(this),
                (error) => console.log(error.message),
                {
                   enableHighAccuracy: true,
                   timeout: 5000
                 }
              );
     }
     render() {
         return (
           <View >
              <MapView
                 style={styles.container}
                 region={{
                 latitude: Number(this.state.latitude),
                 longitude: Number(this.state.longitude),
                 latitudeDelta: 5.12,
                 longitudeDelta: 5.032,
              />                         
           </View>
        );
    }
  }

And I have set the permissions in AndroidManifest.xml as follows,

 <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />

However It always returns latitude: 0, longitude: 0 (default location I presume). same code is working fine in emulator but not in my android device.

Device Name: Huwai(Honor 4x) Android Version: 6.0.1

What should I improve in my code to make it work in mobile?